#212
Simple radar
A radar chart of one team, Team Alpha, across six dimensions.
Hand this to your AI. It names the exact library parts, timings and accessibility promises of this demo.
Build the "Simple radar" pattern (@codeatlasdev/ui demo #212, charts/radar) in my app.
Call get_demo({ ids: ["#212"] }) first and keep its structure. It needs @codeatlasdev/[email protected] + echarts.
Use: Showing a single score profile across several attributes.
Keep these library parts, with the props and tokens the demo uses:
- Card from "@codeatlasdev/ui"
- RadarChart from "@codeatlasdev/ui/charts"
Behaviour to keep:
- `const indicators` maps 6 names (Speed, Quality, Reliability, Innovation, Support, Coverage) to `{ name, max: 100 }`
- `<RadarChart {indicators} series={[{ name: 'Team Alpha', values: [88, 92, 76, 85, 94, 79] }]}`
- `height="340px"` inside `<Card full>`
Reduced motion: the demo handles it; keep that branch.
Keyboard: not an interactive control.
Change only the copy and the data. Use the theme tokens (--ca-*), never raw colours. Library parts
- Card
@codeatlasdev/ui - RadarChart
@codeatlasdev/ui/charts
How it is built
- `const indicators` maps 6 names (Speed, Quality, Reliability, Innovation, Support, Coverage) to `{ name, max: 100 }`
- `<RadarChart {indicators} series={[{ name: 'Team Alpha', values: [88, 92, 76, 85, 94, 79] }]}`
- `height="340px"` inside `<Card full>`
Related
Loading source.