# Radar chart

Two or three profiles on one web: shapes morph when you swap a profile, and a sweep across the axes compares values in place.

- ID: `radar-chart`
- Import: `animui/radar-chart`
- Category: Data
- Runtime exports: `RadarChart`
- Declaration: `types/pro/radar-chart.d.ts`
- Type provenance: reconstructed-from-docs-and-runtime
- Related: bar-chart, slope-chart, donut-chart

```tsx
import { RadarChart } from 'animui/radar-chart';
```

This import example is not a complete render recipe: read the declaration below and its local references for required props, data, callbacks and provider context. Use `animui info radar-chart` to resolve the local declaration graph. Global setup is in `llms.txt`.

```ts
/** Reconstructed from saved Arc documentation and runtime binding evidence; original TypeScript source was unavailable. */
import type { ComponentType, ReactNode, CSSProperties, Ref, ButtonHTMLAttributes, HTMLAttributes, ReactElement } from 'react';

export interface RadarAxis { key: string; label: string; max?: number; }
export interface RadarSeries { id: string; label: string; values: Record<string, number>; color?: string; }
export interface RadarChartProps {
  axes: RadarAxis[];
  series: RadarSeries[];
  label: string;
  max?: number;
  rings?: number;
  size?: number;
  formatValue?: (value: number, axis: RadarAxis) => string;
  activeAxis?: string | null;
  onActiveAxisChange?: (key: string | null) => void;
  legend?: boolean;
  emptyLabel?: string;
  ref?: Ref<HTMLElement>;
  className?: string;
}

export declare const RadarChart: ComponentType<RadarChartProps>;

export default RadarChart;
```