Skip to Content
Technical Articles

Configuring KPI tags of an Analytical List Page (ALP) application

An ALP application allows showing different KPI values as KPI tags. ALP supports two types of KPI tags i.e. filterable and global. As the name suggests global KPI tag value does not depend on the filter selection and are shown on the left corner of the title area of an ALP application.  Whereas filterable KPI’s value can vary depending on the filter selection and are shown on the left-hand side of the smart chart’s toolbar of an ALP application.

On click of any KPI tag, it opens up analytical card pop up which provide more drilled down information about the KPI and which can be further used to navigate to another application for further information.

In this blog, I’ll discuss how to configure these KPI tags of an ALP application along with its various settings like criticality.

Prerequisites

  1. Make sure you have been to the previous blog of this blog series and you have rest of the sample ALP application to add new KPI tags
  2. For reference, you can clone the GIT repo for this sample application which we are building.

Configuring KPI tag

To create a KPI tag, first, you have to add KPI object inside “keyPerformanceIndicators” property of the application manifest

"keyPerformanceIndicators": {
							"KPIRevenue": {
								"model": "kpi",
								"entitySet": "SEPMRA_C_PD_ProductSalesData",
								"qualifier": "KPIRevenue"
							},
							"KPIRevenue1": {
								"model": "kpi",
								"entitySet": "SEPMRA_C_PD_ProductSalesData",
								"qualifier": "KPIRevenue1",
								"filterable": true
							}
						}

description of the KPI object attributes:

model –> name of the data model.

entityset –> entity set of the oData service

qualifier –> qualifier for the KPI annotation

filterable –> whether the KPI is of type global or filterable. Default is Global.

In the above example, I’m creating two KPI tags one filterable (KPIRevenue1) and other global (KPIRevenue).

Now, let’s have a look at the KPI annotation (KPIRevenue) of our global KPI tag (KPIRevenue):

				<Annotation Term="UI.KPI" Qualifier="KPIRevenue">
					<Record>
						<!--<PropertyValue Property="SelectionVariant" Path="@UI.SelectionVariant#CurrencyVisualFilter" />-->
						<PropertyValue Property="DataPoint" Path="@UI.DataPoint#revenue"/>
						<PropertyValue Property="ID" String="KPIRevenue"/>
						<PropertyValue Property="Detail">
							<Record Type="UI.KPIDetailType">
								<PropertyValue Property="DefaultPresentationVariant">
									<Record Type="UI.PresentationVariantType">
										<PropertyValue Property="Visualizations">
											<Collection>
												<AnnotationPath>@UI.Chart#ProductVisualFilter</AnnotationPath>
											</Collection>
										</PropertyValue>
									</Record>
								</PropertyValue>
								<PropertyValue Property="SemanticObject" String="test"/>
								<PropertyValue Property="Action" String="test"/>
							</Record>
						</PropertyValue>
					</Record>
				</Annotation>

UI.KPI annotation mainly has properties like SelectionVariant, DataPoint, ID and Details. first 2 we have discussed in my previous blogs. The ID gives the ID to the KPI tag hence you should make sure its unique for each KPI tag in your application else you will land up in duplicate ID error while runtime.

KPIDetails annotation has PresentationVariant property which has Visualization which I have pointed to existing UI.Chart annotation (just for the sake of simplicity, in most of the practical scenario it will point to different chart annotation) which we created while creating visual filters in my previous blog of this blog series.

KPIDetails annotation also has Semantic Object and action property which will be used for intend based navigation when the end-user click on the KPI tag chart pop up.

Similarly, we need to provide UI.KPI annotation for our filterable KPI tag:

				<Annotation Term="UI.KPI" Qualifier="KPIRevenue1">
					<Record>
						<!--<PropertyValue Property="SelectionVariant" Path="@UI.SelectionVariant#CurrencyVisualFilter" />-->
						<PropertyValue Property="DataPoint" Path="@UI.DataPoint#revenue"/>
						<PropertyValue Property="ID" String="KPIRevenue1"/>
						<PropertyValue Property="Detail">
							<Record Type="UI.KPIDetailType">
								<PropertyValue Property="DefaultPresentationVariant">
									<Record Type="UI.PresentationVariantType">
										<PropertyValue Property="Visualizations">
											<Collection>
												<AnnotationPath>@UI.Chart#CurrencyVisualFilter</AnnotationPath>
											</Collection>
										</PropertyValue>
									</Record>
								</PropertyValue>
								<PropertyValue Property="SemanticObject" String="test"/>
								<PropertyValue Property="Action" String="test"/>
							</Record>
						</PropertyValue>
					</Record>
				</Annotation>

Name displayed on KPI tag

If you notice closely every KPI tag have a name displayed. In our case its REV. This name is coming from the title property of our data point annotation. In my example, the name displayed is REV and title which I had given to our #Revenue datapoint is Revenue.  The logic behind this is:

  1. if the datapoint title is of 1 word then the first 3 letters will be displayed.
  2. else if the datapoint title is of 2 words then the first letters of both words will be displayed.
  3. else the first letters of the first 3 words will be displayed.

The criticality of the KPI tag

The criticality of the KPI tag is derived from the criticality annotation defined for the associated data point. The global KPI tag supports both criticality and CriticalityCalculation annotation whereas filterable KPIs only supports criticality annotation.

Conclusion

In this blog, we successfully configured the KPI tags both global and filterable for our sample ALP application and learnt about different settings for the like name, criticality and navigation of the KPI tags.

What Next?

In the next blog, I’ll discuss various extensions available to ALP application developer.

Be the first to leave a comment
You must be Logged on to comment or reply to a post.