RadialProgressSeries

Try the live demo

import { RadialProgressSeries } from '@wick-charts/react';
 
<RadialProgressSeries data={rings} />

Radial progress: concentric rings, each filled to its value's share of max. New values glide from the ones on screen.

Renders concentric progress rings, outermost first — one per { label, value, color? } entry, filled to its share of max (default 100) from 12 o’clock. Use it for a few related values against the same limit, such as CPU, memory and disk. <PieLegend> lists the rings with their values and percents. The first data sweeps each ring up from 0; new values glide from the ones on screen.

Props

dataPieSliceInput[]

One ring per entry, outermost first: { label, value, color? }. <PieLegend> lists them.

options?Partial<RadialProgressSeriesOptions>

Visual options override — the value of a full ring, ring colors, track color, entry / update durations.

id?string

Stable series ID — same value across remounts.

visible?default trueboolean

Show/hide the series without unmounting it — also hides it from <PieLegend>. Default true. Live.