Intro

The goal of the radial chart is to display a single percentage value. The chart consists of a colored radial bar with a percentage value inside.

The radial micro chart can be embedded into a table, list, tile, or header.

Different radial charts
Different radial charts

Usage

Use the radial micro chart if:

  • You want to display a single value in a table.
  • You want to show a percentage value; the proportion of the total is always calculated and displayed as a percentage.
  • You want to emphasize the visualization; the circular shape is more prominent.
  • You want to use colors from the chart color palettes.

Do not use the radial micro chart if:

  • You want to display a single value in the form of a fillable shape or group of shapes that describe their context. Use the status indicator instead.
  • You want to make it easier to compare better two or more values visually. Use the progress indicator instead.
  • You want to display custom values and not only percentages. Use the progress indicator instead.

Responsiveness and Adaptiveness

See the Micro Chart overview article.

Resources

Want to dive deeper? Follow the links below to find out more about related controls, the SAPUI5 implementation, and the visual design.

Elements and Controls

Implementation

Radial Micro Chart (SAPUI5 samples)