Bar

Bar chart which can display multiple data series, stacked or side by side. Also
supports both vertical and horizontal layout, with negative values descending
below the x axis (or y axis if using horizontal layout).

The bar item component can be customized to render any valid SVG element, it
will receive current bar style, data and event handlers,
the storybook offers an example.

See the dedicated guide on how to setup
legends for this component.
However it requires an extra property for each legend configuration you pass to
legends property: dataFrom, it defines how to compute
legend's data and accept indexes or keys.
indexes is suitable for simple bar chart with a single data serie
while keys may be used if you have several ones (groups).

chartcodedataroll the dice

Actions Logs

Start interacting with the chart to log actions

Base

dataobject[]required

Chart data.

indexBystring | Functionoptionaldefault:'id'

Key to use to index the data.

keysstring[]optionaldefault:['value']

Keys to use to determine each serie.

groupModestringoptionaldefault:'stacked'

stackedgrouped

How to group bars.

layoutstringoptionaldefault:'vertical'

horizontalvertical

How to display bars.

reversebooleanoptionaldefault:false

Reverse bars, starts on top instead of bottom for vertical layout and right instead of left for horizontal one.