This article describes how value labels are displayed and how to customize them.

Default Value Display

By default, values of the data points are automatically displayed close to the data point, so that the user does not have to select each point to check its value.

As a general rule:

• Values never overlap.
• Text can be truncated.
• Numeric values are never truncated.

Columns

Values are displayed above the bar.

Stacked Columns

Values are displayed within each bar.

If the height of the bar is too small so that the bar cannot hold the value itself (bar height < text height), the text is hidden.

Bars

Values are displayed on the right side of the bars.

Stacked Bars

Values are displayed within each bar.

If the width of the bar is too small so that the bar cannot hold the value itself (bar width < text width), the value is hidden.

Custom Value Display

If there are too many data points, it is possible to hide all values or to hide some values.

Hide Values for a Series (Combined Chart)

When combining a line with bars, avoid displaying values for both series unless you are sure that both series will not overlap. Instead, please only show values for the most important series.

Hide Values of a Series (Clustered Bars)

In clustered bars, when a series is not the key focus of the chart, it may be better to hide its values.

Hide Values for a Series (Multiple Lines)

When multiple lines are displayed in a chart, avoid displaying values for all the lines. This leads to cluttered information. Instead, please show only values for the most important line.

Hide Values for Categories

If the focus of the chart is on one specific category and its comparison with other categories, it may be better to hide all the values except the key category.

Hide Values Based on Condition (Min, Max)

It is also possible to highlight the first and last values of a series, or the minimum and maximum value of a series.

Formatting Values

Quantity Formatters

When values use quantity formatters such as short format or percentage, always display the formatters in the data point. For example, display 30M or 12% in the data point.

When appropriate, also show the formatters in the vertical or horizontal axis. For example, the vertical axis will display 10%, 20%, 30%…10%.

Locale

Be locale aware: Display numbers in the format corresponding to the user’s locale settings. For that purpose, use SAPUI5 number formatters.

Resources