Bar chart
D3 chart
For all common D3 chart properties, refer to D3 chart API.
Chart.Bar
js
import { Chart } from 'intergalactic/d3-chart';
BarChartProps
BaseChartProps<> & {...}Name | Type | Description |
---|---|---|
groupKey | string | |
xScale | ScaleBand<any> | ScaleTime<any, any> | |
yScale | ScaleLinear<any, any> | |
type | "stack" | "group" | |
trend | Record<, []> | |
onClickHoverRect | (index: number, e: React.SyntheticEvent) => void | Handle click by `HoverRect`. `index` is an index of the data array. |
onClickBar | (barItem: number, barKey: , e: React.SyntheticEvent) => void | Handle click by Bar. |
Bar
js
import { Bar } from 'intergalactic/d3-chart';
BarProps
& {...}Name | Type | Description |
---|---|---|
x | string | Field name from `data` array item for the XAxis |
y | string | Field name from `data` array item for the YAxis |
color | string | Line color |
hide | boolean | Element hide property |
duration | number | Animation duration in ms |
r | number | number[] | Radius of curvature |
hMin | number | Minimal height |
onClick | (data: {[key: string]:string | number | }, event: React.SyntheticEvent, barIndex: number, barKey: string) => void | Bar click handler |
transparent | boolean | Enables element transparency |
maxBarSize | number | The maximum width of each Bar |
patterns | Enables charts patterns that enhances charts accessibility |
Last updated: