Chart Radar
Radar charts plot one series across several axes on a polar grid. Built as a self-contained SVG component with gradient fill, glow, and dot markers.
Gradient fill
A radar with a vertical gradient fill and a glowing stroke.
Filled with glow
A diagonal gradient, thicker glowing stroke, and ring-style dots.
API Reference
Props, events, and slots for each sub-component.
ChartRadar
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| data | Record<string, any>[] | — | One row per axis. |
| config | ChartConfig | — | Map of dataKey → { label, color }. |
| dataKey | string | "value" | Row key for the plotted value. |
| categoryKey | string | "category" | Row key for the axis label. |
| maxDomain | number | 100 | Value mapped to the outer ring. |
| gridLevels | number | 5 | Concentric grid rings. |
| gradient | boolean | true | Fill the area with a gradient. |
| gradientDirection | "vertical" | "diagonal" | "vertical" | Gradient direction. |
| glow | boolean | true | Apply a glow filter to the stroke. |
| dots | boolean | true | Render dot markers at each vertex. |
| dotVariant | "solid" | "ring" | "solid" | Filled dots or background-filled rings. |
| strokeWidth | number | 2 | Series outline width. |