Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
Showing results for 
Search instead for 
Did you mean: 
Product and Topic Expert
Product and Topic Expert

This is an introduction of the new scorecard component.

The scorecard component introduced in release 1.6 will allow you to define highly customizable tables. You will have influence on all visualization properties for the content and more content types (small charts) as well. Binding any property of the content to the data view is allowing you to react on some values / master data and make any property value conditional.

The Idea in Overview

The main idea behind the scorecard component is the mapping between the data source and the visualization. The visualization is based on a table, so what you can define are columns of the table. A column has cell content with type, header and some general properties. A property has a value which can be maintained directly or bound to the data set using the known data selection model -> this is the binding concept. Every property is independent of each other, but you can make them a kind of dependent if you bind them to the same data cell value.

Selection for Row Scope

Before you can start definition of the scorecard, you need to understand the Row Scope concept. The row scope is defining how many rows you will have in the scorecard and which data are accessible for you in a single row. You need to select a dimension from row dimensions and then the scorecard will get as many rows as many combinations of the selected dimensions are available.

Property Binding

To fill a property with value you can bind it to a chosen aspect of a data source. It can be data cell, some metadata or master data. Of course, the majority of the properties must use the conditional bindings to translate the selected value from data source to the target value. E.g. you want to set the background color to RED when conditional format (BEx Exception) has value 5. For this you have to map it, 5 => RED. then the system will evaluate the value and match the conditional binding to fill in the correct color value.

Example on Simple Data Source

We will try to visualize the following data source (here as crosstab) with scorecard, reducing number of rows and compacting the information.

Crosstab. In my data source I have 3 dimensions in rows (Region / Product Group / Customer) and 2 dimensions in columns (Year Quarter and Measures). For the row scope we can select only from dimensions from rows. In my example I will select the row scope "up to Product Group". What does this mean? The scorecard will be defined by multiplied members of those 2 dimensions, the number of rows will be defined by number of members of the Regions by Product Group. Result members are counted as standard members.

Scorecard. When the row scope is defined, you can generate an initial scorecard. What you get is this (see documentation for the generation routine).

The columns are as below:

1. the members of "Region"

2. the members of corresponding "Product Group"

3. the "Result Member" for the dimension "Billed Quality" (as this is the first one in the measures)

4. a line chart for members of dimension "Customer".

5. comparison chart (which in this case makes not much sense, so we delete this column).

Few Changes to Achieve my View

Now, having a scorecard, I want to achieve a bit different view. I want to have the column chart in column 4 and I want to have line chart for the dimension "Year Quarter" to see the change between Q4 and Q1.

The first change is simple, we just need to change the chart type. all other properties stay.

The second change is also simple, we add new column and defined this to the type "Trend Chart, Line". The most important setting is the selection of the content for "Actual Values". For this, we use the binding type "Multiple Cell Values" (the only one for multiple values) and select the cells we want:

What is important in this selection dialog is, the dimensions which are in tow scope do not matter. This is because those have values assigned by the rows. The dialog is visualizing the selection, but you can logically ignore it. Then, as we want to have all members of the dimension "Year Quarter", we will not touch this dimension, the system will add corresponding selection for it. We just need to specify the others dimensions to fix their members - in this case, the result for "Customer" and "Sale Value" for measures.

This is the effect of the selection:

Understanding the selections

When you look at the used selection, there is the "BLUE" one (locked, not changeable) and "WHITE" one (in the property with value help).

The BLUE value represents the effective selection - this one do not contain the dimensions which are included in the row scope definition. It means this one is always less specified than the selection in the WHITE property (here "Selected Data Cells"). Additionally, all not selected dimensions will be introduced with "*" or "?" key as selection - it means, "all" members or "all w/o result" members will be selected from the dimension.

The WHITE property is holding 1:1 as the Help-Dialog is requiring it. It includes all defined dimensions (which is required to allow the same selection when dialog is started again). This effect is important and this is also the reason why you should never change the data source or row scope once the scorecard has already specified columns.


Assuming: REGION is in Row Scope (removed) and YEAR_QUARTER was not selected (inserted with "?")



Additional Settings which helps you in Comparison.

Making the settings as above, you will see the line - but you need to be aware about the scale. The scale is based on each row values. It means you see the direction in each row (increasing or decreasing) but you cannot compare the rows with each other. For this, you can use the fixed values for minimum and maximum.

Then, you can see the chart like here:

or as columns, changing to columns and adjusting the fixed scale:

I hope this will help with startup, I will try to provide more examples on different scenarios.

The example can be downloaded from this link:

applications/ at master · org-scn-design-studio-community/applicat...

(download as raw content and import in Design Studio)