Docs/Radial Chart

Radial Chart

Radial bar charts for circular progress indicators.

Installation

tsx

1import { StormRadialChart } from '@storm-ds/ui/charts'
2
3# Requires recharts peer dependency
4pnpm add recharts

Default

tsx

1import { StormRadialChart } from '@storm-ds/ui/charts'
2
3const data = [
4  { name: 'Progress A', value: 85 },
5  { name: 'Progress B', value: 65 },
6  { name: 'Progress C', value: 45 },
7]
8
9<StormRadialChart data={data} />

Semi-circle

tsx

1<StormRadialChart
2  data={data}
3  startAngle={180}
4  endAngle={0}
5/>

Radar Chart

Icon Browser