Introduction
In this blog, I’ll explain Micro Bullet chart’s feature and how to use it in List Report using CDS annotations. I have added screen shot from annotation modeler and respective xml code in case you are using one of these approach.
The bullet chart features a single, primary measure. It compares that measure to one or more other measures to enrich its meaning (for example, compared to a target), and displays it in the context of qualitative ranges of performance, such as poor, satisfactory, and good.
Bullet chart is placed horizontally, like a progress bar, and this fits the bill to put is in the list report. Unlike progress bar which tracks current values with respect to fixed maximum, bullet chart tracks current value with a small number of other values.
As with other micro charts, bullet micro chart is fully responsive.
Use Case
In this example, Unrestricted stock for Materials in Plant is tracked against a predefined value called Reorder Point. Reorder point in SAP (without getting into picture-perfect definition) is stock below which Material needs to be replenished. To visually highlight where attention is required semantic colours are used.
With the use of bullet chart Unrestricted Stock is not only tracked against Reorder Point but also relative to the Threshold value which is 1.5 times Reorder point. This threshold value defined is used to highlight that stock is near Reorder point and also allow us to change semantic colour to yellow. In this particular use case, green means stock is more than this threshold value.
Adding Micro Bullet Chart
In CDS view ZI_MaterialReOrder, we have three fields ReOrderPoint, UnresforDisplay and WarningThresHold which we will use.
define view ZI_MaterialReOrder
as select from marc
...
association [0..1] to ZI_MaterialPlantStock as _MaterialPlantStock
on $projection.Material = _MaterialPlantStock.Material and
$projection.Plant = _MaterialPlantStock.Plant
{
key marc.werks as Plant,
key marc.matnr as Material,
…
marc.minbe as ReOrderPoint,
MaterialPlantStock.UnrestricedStock as UnresforDisplay,
cast( marc.minbe as abap.fltp) * 1.5 as WarningThresHold,
…
}
Define bullet chart using @UI.chart annotation on the entity, followed by @UI.datapoint annotation at field level of the entity. Also note that in @UI.lineitem field is defined as type #AS_CHART.
@UI.chart: [{
chartType: #BULLET ,
measures: ['UnresforDisplay'],
measureAttributes: [{
measure: 'UnresforDisplay' ,
role: #AXIS_1 ,
asDataPoint: true
}]
}]
annotate view ZI_MaterialReOrder with
{
…
@UI:{ lineItem: [{ position: 100 ,
type: #AS_CHART,
label: 'Stock Level' }]
}
@UI.dataPoint: { title: 'Unrestricted Stock' ,
targetValueElement: 'ReOrderPoint' ,
minimumValue: 0 ,
maximumValue: 2500
}
UnresforDisplay;
}
With above annotations, you would get the bullet chart in the list, but without semantic colours.
Semantic Colour
Here you have two options:
Option 1: Using @UI.dataPoint.criticality
Define a field (lets call it CriticalValue ) with critically value 0,1,2 and 3 based on Unrestricted Stock with respect to Reorder Point and ThresHold and then use this fields as
@UI.dataPoint: { title: 'Unrestricted Stock' ,
targetValueElement: 'ReOrderPoint' ,
minimumValue: 0 ,
maximumValue: 2500 ,
criticality: ‘CriticalValue’
}
UnresforDisplay;
Option 2: Using Trend-Criticality Calculation
@UI.dataPoint.criticalityCalculation annotation is used to define rules for criticality. This calculation is based on three different scenarios defined by annotation @UI.dataPoint.criticalityCalculation.improvementDirection. In this use case, #MAXIMIZE scenario is applicable and relevant values are described in below picture.
with this option @UI.dataPoint annotation will look like
@UI.dataPoint: { title: 'Unrestricted Stock' ,
targetValueElement: 'ReOrderPoint' ,
minimumValue: 0 ,
maximumValue: 2500 ,
criticalityCalculation: {
improvementDirection: #MAXIMIZE ,
deviationRangeLowValueElement: 'ReOrderPoint' ,
toleranceRangeLowValueElement: 'WarningThresHold'
}
}
UnresforDisplay;
This should provide you with semantic colours in bullet chart and an indicator showing ThresHold level.
Below is annotation from modeler and its XML code
Annotation Modeler
XML
<Annotations Target="ZMATREORDER_SRV_01.ZI_MaterialReOrderType">
<Annotation Term="UI.LineItem">
<Collection>
...
<Record Type="UI.DataFieldForAnnotation">
<PropertyValue Property="Label" String="Stock Level"/>
<PropertyValue Property="Target" AnnotationPath="@UI.Chart"/>
</Record>
</Collection>
</Annotation>
<Annotation Term="UI.DataPoint" Qualifier="UnresforDisplay">
<Record Type="UI.DataPointType">
<PropertyValue Property="Value" Path="UnresforDisplay"/>
<PropertyValue Property="Title" String="Unrestricted Stock"/>
<PropertyValue Property="TargetValue" Path="ReOrderPoint"/>
<PropertyValue Property="MinimumValue" Decimal="0"/>
<PropertyValue Property="MaximumValue" Decimal="2500"/>
<PropertyValue Property="CriticalityCalculation">
<Record Type="UI.CriticalityCalculationType">
<PropertyValue Property="ImprovementDirection" EnumMember="UI.ImprovementDirectionType/Maximize"/>
<PropertyValue Property="DeviationRangeLowValue" Path="ReOrderPoint"/>
<PropertyValue Property="ToleranceRangeLowValue" Path="WarningThresHold"/>
</Record>
</PropertyValue>
</Record>
</Annotation>
<Annotation Term="UI.Chart">
<Record Type="UI.ChartDefinitionType">
<PropertyValue Property="Title" String="Bullet title"/>
<PropertyValue Property="Description" String="Description"/>
<PropertyValue Property="ChartType" EnumMember="UI.ChartType/Bullet"/>
<PropertyValue Property="Measures">
<Collection>
<PropertyPath>UnresforDisplay</PropertyPath>
</Collection>
</PropertyValue>
<PropertyValue Property="MeasureAttributes">
<Collection>
<Record Type="UI.ChartMeasureAttributeType">
<PropertyValue Property="Measure" PropertyPath="UnresforDisplay"/>
<PropertyValue Property="Role" EnumMember="UI.ChartMeasureRoleType/Axis1"/>
<PropertyValue Property="DataPoint" AnnotationPath="@UI.DataPoint#UnresforDisplay"/>
</Record>
</Collection>
</PropertyValue>
</Record>
</Annotation>
</Annotations>
No comments:
Post a Comment