GroupedBarChart is used to represent and compare different categories of two or more groups. It helps to better visualize and interpret differences between categories across groups as they are arranged side-by-side.
Size of the parent element/component (passed by the Responsive hoc)
type: shape[object Object]
Additional css classes passed from parent
type: string
defaultValue: ''
Array of colors as hex color codes. It is used if colors are not provided through data.
type: arrayOf[object Object]
defaultValue: schemeAccent
The data to be visualized values: Array of categorical data grouped together columns: Array of category names colors: map of columns to respective colors Example data: { values: [{ state: 'Province 1', river: 10, hills: 20 }, { state: 'Province 2', river: 1, hills: 3}], columns: ['river', 'hills'], colors: { river: '#ff00ff', hills: '#0000ff' }, }
type: shape[object Object]
Select a group for each data value.
type: func
Margins for the chart
type: shape[object Object]
defaultValue: { top: 10, right: 0, bottom: 40, left: 40, }
Axis arguments for x-axis See tickArguments
type: array
defaultValue: []
Axis arguments for y-axis See tickArguments
type: array
defaultValue: [null, 's']