Horizontal Bar Chart
Horizontal bars for long category labels and ranking comparisons. Data flows left to right.
Usage
import { HorizontalBarChart } from "@chartts/react"
<HorizontalBarChart
data={teamData}
x="department"
y="headcount"
sorted
/>Props
| Prop | Type | Description |
|---|---|---|
| data | T[] | Array of data objects |
| x | keyof T | Key for category labels |
| y | keyof T | Key for bar values |
| sorted | boolean | Sort bars by value. Default: false |
| radius | number | Border radius. Default: 4 |
Features
- Automatic label alignment
- Sort by value ascending/descending
- Value labels at bar end
- Grouped variant
- Animated entry
- Responsive label truncation
Other Charts
Line ChartBar ChartArea ChartPie / Donut ChartScatter ChartBubble ChartRadar ChartCandlestick ChartWaterfall ChartFunnel ChartGauge ChartSparklineStacked Bar ChartDonut ChartHeatmapBox PlotHistogramTreemapPolar ChartRadial Bar ChartLollipop ChartBullet ChartDumbbell ChartCalendar ChartCombo ChartSankey Diagram