Radial Bar Chart

import { RadialBarChartDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx';

export default Layout(MDX_DATA.RadialBarChart);

Usage

RadialBarChart is based on the RadialBarChart recharts component:

<Demo data={RadialBarChartDemos.usage} />

Change color

You can reference theme colors or use any valid CSS color in the color property of data:

<Demo data={RadialBarChartDemos.color} />

Legend

To show the legend, set the withLegend prop:

<Demo data={RadialBarChartDemos.legend} />

Labels

To show labels, set the withLabels prop:

<Demo data={RadialBarChartDemos.labels} />

Hide tooltip

To hide the tooltip, set the withTooltip={false} prop:

<Demo data={RadialBarChartDemos.noTooltip} />