Radar Chart

Compare multiple variables on a single chart with radar plots. Chart.ts renders polygons on configurable axes with multi-series overlay, custom grid levels, and SVG output. Also known as spider charts or web charts.

$npm install @chartts/core
example.tsx
import { radar } from "@chartts/core"

const svg = radar({
  data: [
    { axis: "Attack", teamA: 85, teamB: 72 },
    { axis: "Defense", teamA: 70, teamB: 88 },
    { axis: "Speed", teamA: 90, teamB: 65 },
    { axis: "Stamina", teamA: 75, teamB: 82 },
    { axis: "Technique", teamA: 82, teamB: 78 },
  ],
  label: "axis",
  series: ["teamA", "teamB"],
})

Features

Multi-axis comparison
Multiple series overlay
Configurable grid levels and scales
Polygon fills with opacity
Axis labels and value markers
SVG rendering with Tailwind CSS
Under 3kb tree-shaken
Read the DocsSee DemosExamples