D3 Charts
Responsive, accessible relationship and hierarchy charts for data that does not fit a Cartesian plot.
Installation
Import from the package. Do not run shadcn add in your app.
tsx
import { SankeyChart } from "@carsxe/design-system/components/d3-chart"Usage
tsx
import { SankeyChart } from "@carsxe/design-system/components/d3-chart"
<SankeyChart ariaLabel="Vehicle lifecycle" nodes={nodes} links={links} />Force-directed network
Treemap
Sunburst
API Reference
| Prop | Type | Default |
|---|---|---|
| ariaLabel | string | — |
| height | number | 360 |
| colors | string[] | CarsXE chart tokens |
| onNodeSelect | (node) => void | — |