The Polar Bar chart component displays data in a circular layout where each bar extends radially from the center.
Unlike radial bar charts, which vary both angle and length, polar bar charts use
equal angular spacing for each category (defined by indexBy) and rely on bar length
to represent values, making them perfect for visualizing cyclical patterns like seasons,
compass directions, or time-based data.
Chart data.
'id'Key to use to index the data.
'value']Keys to use to determine each series.
Define how many steps (ticks) to use for the value scale.
trueExtends the range of values so that it starts and ends on nice round values.
Optional formatter for values.
Chart width.
Chart height.
Chart margin.
0Start angle (in degrees).
360End angle (in degrees).
0Donut if greater than 0. Value should be between 0~1 as it's a ratio from outer radius.
0Rounded arc corners.
Define style for common elements such as labels, axes…
Define chart's colors.
0Shape border width.
Method to compute border color.
falseEnable/disable arc labels.
'formattedValue'Defines how to get label text, can be a string (used to access current node data property) or a function which will receive the actual node data.
0.5Define the radius to use to determine the label position, starting from inner radius, this is expressed as a ratio.
0Skip label if corresponding arc's angle is lower than provided value.
0Skip label if corresponding arc's radius is lower than provided value.
Defines how to compute arc label text color.
trueEnable radial grid (rays).
trueEnable circular grid (rings).
radialAxis axis configuration.
circularAxisInner axis configuration.
circularAxisOuter axis configuration.
'grid', 'arcs', 'axes', 'labels', 'legends']Defines the order of layers and add custom layers.
trueEnable/disable interactivity.
Override default tooltip.
Override default tooltip.
onClick handler.
onMouseEnter handler.
onMouseMove handler.
onMouseLeave handler.
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.
Can be used to get the computed legend data.
Main element role attribute.
Main element aria-label.
Main element aria-labelledby.
Main element aria-describedby.
trueEnable/disable transitions.
'gentle'Motion config for react-spring, either a preset or a custom configuration.
'outerRadius'Define how transitions behave when elements enter/leave.