Combo Chart
FREEBars with lines on a right axis: Pareto, volume vs. rate, actual vs. target.
Installation
Terminal
npx @bloxa/cli add combo-chart
# or: npx shadcn@latest add @bloxa/combo-chartPackages installed automatically: motion
Examples
Pareto
Bars show downtime; the line shows the cumulative share on the right axis.
API reference
Every component also accepts the props of the element it renders.
ComboChart
| Prop | Type | Default | Description |
|---|---|---|---|
| data | object[] | — | Rows. |
| index | string | — | Key for x-axis labels. |
| categories | string[] | — | Bar series (left axis). |
| lineCategories | string[] | — | Line series (right axis). |
| lineValueFormatter | (value) => string | — | Format for the line series, e.g. percent. |
| lineDomain | [number, number] | — | Right axis range, e.g. [0, 100]. |
| stacked | boolean | false | Stack the bars. |
| labels / colors / valueFormatter / height | — | Same as BarChart. |