Radar Chart

Polygon spider chart for multi-axis system diagnostics. Single or multiple overlapping series.

/// SystemsShip Diagnostics

Nominal

Critical

/// PerformanceSystem PerformanceCurrent system readiness

Readiness

Add to your project

One command adds this component to your project.

Run the following command. New project? Run npx shadcn@latest init first to set up Tailwind and path aliases.

npx shadcn@latest add @aicanvas/andromeda-radar-chart

Every prop this component accepts. Any other prop is forwarded to the underlying element.

Prop	Type	Default	Description
keyreq	`string`	-	Key in each data row whose numeric value this series plots.
labelreq	`string`	-	Series name shown in the legend and tooltip.
color	`string`	-	Stroke and fill color for this series, defaults to the accent color.

Prop	Type	Default	Description
data	`object[]`	-	Array of data rows, each an axis label plus one numeric value per series.
series	`RadarSeries[]`	-	Series descriptors defining which data keys to plot and how.
label	`string`	'/// Diagnostics'	Kicker text shown above the title in the card header.
title	`string`	'Systems Radar'	Main heading shown in the card header.
description	`string`	-	Optional line of text shown beneath the title.
className	`string`	-	Additional CSS classes for the root element.
style	`React.CSSProperties`	-	Inline styles merged onto the root element.