BarChart
BarChart — Prism component.
Signature
Density
Viewport
Theme follows the navbar ☀/☾ toggleWhen to use
BarChart — Prism component.
Accessibility
Each chart ships an accessible fallback (a visually-hidden data table / aria-label summary) so the data is available to screen readers, not just sighted users. Colour is paired with shape/label, never used alone.
Import
const { BarChart } = window.PrismDesignSystem_39d121;
Examples
Stacked
<BarChart stacked categories={["Q1","Q2","Q3","Q4"]}
series={[{ name: "New", data: [120,180,150,210] },
{ name: "Returning", data: [90,110,140,160] }]} />
Props
| Prop | Type | Required | Description |
|---|---|---|---|
categories | string[] | Yes | |
series | BarSeries[] | Yes | |
stacked | boolean | — | |
height | number | — | |
showGrid | boolean | — | |
showLegend | boolean | — | |
yTicks | number | — | |
formatY | (v: number) => React.ReactNode | — | |
caption | string | — |