Radar Chart

Лепестковые диаграммы для сравнения профилей. Pro · Графики и аналитика › Доли и структура

Установка

npx valyro-cli@latest login
npx valyro-cli@latest add radar-chart

npm install valyro-ui-pro

import 'valyro-ui-pro/styles.css';
import { RadarChart } from 'valyro-ui-pro';

Prop	Type	Default
`data` *	`T[]`		One row per axis (3–12 read well).
`axis` *	`A`		Field naming each axis.
`series` *	`ChartSeries<T>[]`		One filled polygon per series.
`max`	`number`		Value at the outer ring. Default: a nice number above the largest value.
`levels`	`number`	`4`	Number of grid rings. Default 4.
`gridShape`	`'polygon' \| 'circle'`		Default: the theme's `--ui-radar-chart-grid` (`polygon` in Vercel, `circle` in Glass).
`height`	`number`	`320`	Chart height in px; the radar is centred in the container width. Default 320.
`valueFormatter`	`ValueFormatter`		Formats values in the tooltip and table; ring labels use compact numbers by default.
`locale`	`string`		BCP 47 locale for the default number formatting. Default: the `ThemeProvider` locale, then the browser's.
`axisLabel`	`string`		Header of the axis column in the accessible data table. Default: the `axis` key.
`labels`	`Partial<RadarChartLabels>`		Overrides for the built-in strings.
`showLegend`	`boolean`		Default: shown when there is more than one series. Click an item to hide its series.
`loading`	`boolean`	`false`	Shows a placeholder of the same height while data loads.
`ariaLabel` *	`string`		Accessible name of the chart (also the caption of its sr-only data table).