The Marimekko
component is somewhat similar to a bar chart,
but it allows you to use an extra dimension to compute the
thickness of each bar.
It also shares some behavior of the Stream
chart regarding
the way we can configure the offset
.
The responsive alternative of this component is ResponsiveMarimekko
.
You can also see more example usages in the storybook.
See the dedicated guide on how to setup legends for this component.
Chart data, which should be immutable.
ID accessor.
Value accessor.
Data dimensions configuration.
Optional formatter for values.
'vertical'
How to display bars.
'none'
Offset type.
0
Space before the first bar and after the last one.
3
Space between bars.
Chart width.
Chart height.
Chart margin.
Define style for common elements such as labels, axes…
Define chart's colors.
Define patterns and gradients.
Define rules to apply patterns and gradients
Patterns.
0
Slices border width.
Method to compute border color.
false
Enable/disable x grid.
Specify values to use for vertical grid lines.
true
Enable/disable y grid.
Specify values to use for horizontal grid lines.
Top axis configuration.
Right axis configuration.
Bottom axis configuration.
Left axis configuration.
'grid'
, 'axes'
, 'bars'
, 'legends'
]Defines the order of layers and add custom layers.
true
Enable/disable interactivity.
onClick handler, it receives target bar data and mouse event.
onMouseEnter handler, it receives target bar data and mouse event.
onMouseMove handler, it receives target bar data and mouse event.
onMouseLeave handler, it receives target bar data and mouse event.
Custom tooltip component
Showcase custom tooltip.
true
Enable/disable transitions.
'gentle'
Motion config for react-spring, either a preset or a custom configuration.
Optional chart's legends.
Defines legend anchor relative to chart's viewport.
Legend direction, must be one of 'column', 'row'.
Justify symbol and label.
Legend block x translation.
Legend block y translation.
Legend item width.
Legend item height.
Spacing between each item.
Item symbol size.
Item layout direction.