ChartsProgress & KPI
Gauge Chart
Display a single KPI value as a semi-circular arc against a defined range. Perfect for at-a-glance progress tracking — revenue targets, completion rates, performance scores.
Examples
When to Use
- Showing progress toward a single goal or target
- Dashboard KPI tiles (revenue, SLA, utilization)
- Comparing actual vs. target with a clear visual marker
- Any metric that fits a min–max range
Data Roles
Loading data roles...
Settings
Gauge Appearance
Thickness Ratio
numberRatio of arc thickness to radius (0.08–0.55).
Default:0.22Track Color
colorColor of the unfilled track behind the arc.
Default:#E8D8DDFill Color
colorColor of the filled portion of the gauge.
Default:#B63E52Rounded Caps
booleanRound the ends of the gauge arc.
Default:trueText
Show Value
booleanDisplay the raw value inside the gauge.
Default:trueShow Percent
booleanDisplay the percentage below the value.
Default:truePercent Decimals
numberNumber of decimal places for the percentage.
Default:1Show Endpoints
booleanShow min and max labels at the arc ends.
Default:trueTarget
Show Target
booleanDisplay a target tick mark on the arc.
Default:trueTarget Color
colorColor of the target marker line.
Default:#1D4ED8Line Width
numberWidth of the target marker line in pixels.
Default:2Show Label
booleanDisplay the target percentage label.
Default:trueCommon settings like Tooltip configuration are covered in Shared Concepts.
Tips & Best Practices
- Bind a Maximum value field to control the scale — without it, the gauge auto-derives bounds from the value
- Enable the target marker to show a goal line; the label shows the target percentage
- Use rounded caps for a modern look, or disable them for a flat industrial style