Binary Dreams UI Kit reference Chart

Chart

Accessible SVG line or area chart with tooltip and data table.

Loading interactive example

Use Chart for a labelled trend with one or more stable series when readers need axes, values, and accessible source data.

API

Member	Type	Kind	Required	Default
`curve`	`ChartCurve`	prop	No	`'monotone'`
`directLabels`	`boolean`	prop	No	`false`
`empty`	`Snippet`	snippet	No	`undefined`
`height`	`number`	prop	No	`280`
`label`	`string`	prop	No	`undefined`
`loading`	`boolean`	prop	No	`false`
`onPointHover`	`(hover: ChartHover \| null) => void`	callback	No	`undefined`
`series`	`ChartSeries[]`	prop	Yes
`showGrid`	`boolean`	prop	No	`true`
`showLegend`	`boolean`	prop	No	`undefined`
`showTooltip`	`boolean`	prop	No	`true`
`showXAxis`	`boolean`	prop	No	`true`
`showYAxis`	`boolean`	prop	No	`true`
`size`	`ControlSize`	prop	No	`'md'`
`tickFormatX`	`(x: number) => string`	callback	No	`undefined`
`tickFormatY`	`(y: number) => string`	callback	No	`compactNumber`
`tooltipContent`	`Snippet<[ChartHover]>`	snippet	No	`undefined`
`variant`	`ChartVariant`	prop	No	`'area'`
`xScale`	`ChartXScale`	prop	No	`'time'`
`xTicks`	`number`	prop	No	`6`
`yMax`	`number`	prop	No	`undefined`
`yMin`	`number`	prop	No	`undefined`
`yTicks`	`number`	prop	No	`5`

Loading source