Sunburst

Concentric arc rings showing hierarchy. Self-contained SVG (no ChartRoot).

Primitive: ChartSunburst· Standalone (no ChartRoot needed)

Interactive demo

Usage

import { ChartSunburst } from '@ramtt/charts'

<ChartSunburst
  data={{
    name: 'Training',
    children: [
      { name: 'Cycling', value: 12, children: [{ name: 'Z2', value: 8 }] },
      { name: 'Running', value: 5 },
    ],
  }}
  size={300}
/>

Props

Prop	Type	Default	Description
data*	`SunburstNode`	—	Hierarchical tree (root with children)
size	`number`	300	Width = height in px
innerRadius	`number`	0.25	Center hole as fraction of total radius
colors	`string[]`	—	Color palette for top-level groups
padAngle	`number`	0.5	Gap between segments in degrees