/

Radar Chart

Compare multiple variables on a radial layout. Ideal for skill assessments, performance profiles, and multi-attribute comparisons.

Usage

example.tsx
import { RadarChart } from "@chartts/react"

<RadarChart
  data={[teamStats]}
  axes={["speed", "power", "accuracy", "defense", "stamina"]}
  fill
/>

Props

PropTypeDescription
dataT[]Array of data objects
axes(keyof T)[]Keys for each spoke axis
fillbooleanFill the area. Default: true
fillOpacitynumberOpacity of filled area. Default: 0.15
gridLevelsnumberNumber of concentric grid rings. Default: 5

Features

  • Multiple series overlay
  • Configurable grid levels
  • Filled or outline mode
  • Interactive axis highlighting
  • Custom axis labels and scales
  • Animated draw-in

Other Charts