Show TOC

Radial Micro ChartLocate this document in the navigation structure

Displays a ring chart representing a percentage value.


The RadialMicroChart control provides the functions to show a ring chart with the percentage value in the center. To indicate the significance of the displayed percentage value you can define the status as Good, Neutral, Critical, or Error.

  • The percentage value represented by the RadialMicroChart control can be defined in the following ways:

    • Insert the percentage property directly.

    • Set the total and the fraction property and the percentage value is calculated automatically.

      Note If the total property is set to 0, only a blank circle gets rendered as this does not return a valid value. The error is described in the error log.
  • The color of the circle is defined by setting the valueColor property to one of the following types:

    • sap.m.ValueColor: Enumeration of possible value color settings representing the status Good, Neutral, Critical, and Error.

    • sap.ui.core.CSSColor: All CSS color values are allowed.

  • The RadialMicroChart control does not have a defined width or height but uses the available space provided by the parent control. If the height and width of the control are between 46px and 54px, a different text color is used for the percentage value for accessibility reasons. If the height and width are below 46px, the percentage value is not displayed inside the circle.

API Reference/Explored Samples