Status
The status of the component
Documentation in progress
Figma component
A link to the Figma library where the component lives.
Repository
A link to the repo where the component lives.
-
Best Practices
- Gauge charts are used to measure only one metric.
- Always start at the zero mark (bottom left of the gauge).
- Use the default categorical color (ie. Teal).
- Do not use multiple gauge charts to show change over time. A gauge chart shows the current state at a single point of time.
Usage Guidelines
Labels
Gauge charts may have a target label.
Gauge charts may also have a trend indicator acting as the center subtitle.
Responsiveness
The entire chart (including the center header) should proportionally resize as the chart grows/shrinks. For more information on center header resizing, please refer to the ‘Typography’ section of this documentation.
