Components / Charts
DonutChart
A donut with legend toggles and an “Other” fold-in past 8 slices.
@ruckc/truss-chart Charts
Import
import { DonutChart } from '@ruckc/truss-chart';
import '@ruckc/truss-chart/charts.css'; // series palettePlayground
slices
size
API
| Prop | Type | Default | Description |
|---|---|---|---|
slices required | { name: string; value: number }[] | — | The slices: `{ name, value }[]`. |
title | string | — | Heading text. |
subtitle | string | — | Secondary text under the title. |
size | number | 200 | Control size: `sm` (24px), `md` (32px, default) or `lg` (40px). |
format | (n: number) => string | fmtValue | Formats a number for display. |
centerLabel | string | 'Total' | Caption under the total in the centre. |