GaugeChart

modelValue is the reading. It's clamped into min…max before it's drawn, so an out-of-range value pins the arc rather than overshooting it. An array breaks one reading into the parts that make it up — the arc still ends at the total, with the split visible inside it.

ariaLabel is required. A gauge is a single number drawn as an angle — this is what makes that number available at all without sight.

ariaDescription is the detail the label shouldn't carry — a threshold, a trend, what happens at the top of the range.

min is the bottom of the range. Raise it when zero isn't a meaningful floor — a temperature, a score that starts at 200 — so the arc spends its length on the part that varies.

max is the top of the range, and what the percentage readout is a percentage of. Set it to the real ceiling rather than the largest value you happen to have.

label is the text under the readout, naming what's being measured. Without it the gauge is a number with no subject.

labels names a breakdown's segments, in the same order as the values. Without them the parts are unexplained colors: the middle of the gauge belongs to the total, so the legend is the only place their names can go.

display replaces the center readout wholesale. Reach for it when the number to show isn't a function of the value — a grade, a status word, a fraction.

valueFormat formats the center readout, which otherwise shows the percentage of the range. It formats each segment's value in the legend too, so a breakdown's parts read in the same units as its total.

sweep sets how far around the circle the track runs, centred on twelve o'clock. 270 is the classic dial; 180 is the half-circle that sits under a stat tile without wasting the height a full dial needs.

thickness is the arc's width as a fraction of the radius. Thin reads as precise, thick as a status light — pick from how the number is meant to be used, not from how much room there is.

gap separates a breakdown's segments, in degrees. It's taken out of the joins only — the two ends of the run are where the reading is, so a gap there would change the number the arc reports.

color paints the filled arc — and the first segment of a breakdown, so it keeps doing the obvious thing when a single reading later grows a split. Binding it to a threshold is the usual move: the gauge then changes meaning as the value crosses one, without any extra chrome.

colors paints a breakdown's segments, positionally. Left unset they take the library's default sequence, which is ordered so neighbouring pairs stay apart for a colorblind reader — set it when the parts carry meanings of their own, like an Other bucket that should recede.

trackColor paints the unfilled remainder. Lighten it on a raised surface so the track doesn't read as a hole punched through the card.

tooltip names what's under the pointer on hover. On a breakdown that's the segment, identified without tracing its color back to the legend; on a single reading it's the value the other way round from the readout — the percentage of the range beside the number in its own units. Only the filled arc answers: the track past the reading is the remainder, not a datum.

animate is on by default: the arc sweeps up from min on the first draw and eases to each new reading. Roll new values to compare it with the chart on the right, which has it off. Only the arc moves — the readout always shows the real number — and a reader who has asked their system for reduced motion gets no motion either way.

legend lists a breakdown's segments under the gauge. It needs labels — there's nothing to name without them — and never appears on a single reading, whose readout and label already say what it is.

legendPosition puts the legend above the gauge instead of below it. Above works when the gauge sits at the bottom of a tile and the names are what the eye should meet first.

legendAlign places the entries across the legend's width. Centred by default, since the gauge it belongs to is centred too.

legendOrientation stacks the entries one per line. Worth it once the labels are long enough to wrap, or when valueFormat prints a value beside each one.

legendGroup names a group that a standalone UiChartLegend with the same group belongs to, so the legend can sit anywhere — here above the plot — and still dim the other segments while you hover an entry. The chart hands the legend its entries, colors included, so it needs no items. Switch the chart's own legend off if you don't want two.

height is the plot's height in pixels; the arc is sized to fit inside it. It's ignored once aspectRatio is set.

aspectRatio sizes the gauge from its container's width instead of a fixed height.

loading is a skeleton at the gauge's exact height, so a tile doesn't resize when the reading lands.

A gauge spends a lot of space on one number. If the value is a straightforward completion — a form, an upload, a quota bar in a settings row — a Progress says the same thing in a line.