Performance Dashboard – Creation of a KPI type component

Performance Dashboard – Creation of a KPI type component

Estimated reading: 12 minutes 271 views

The KPI type component serves to quickly create a graphic representation of the recorded data for their analysis over time (comparison of the same time periods) or for comparison with other data. In the same way, the KPI type can also present the frequency of the condition in the form of pie or donut charts. In the following section, we will describe the individual types and how they are established.

Creating a KPI component

After selecting a KPI in the Type field, a new KPI field appears. If you order a new chart, do not fill in the field, but press the (+) button. See the following picture.

If we want to use an existing KPI definition, just select it from the offered menu. That is why it is very important to mark individual KPI definitions well and comprehensibly.

What is KPI definition?

The KPI definition represents a web interface that determines for a given component what data will be selected for processing (a selection request is created in the background – the SQL request) and how it will be visualized and interpreted. The method of selection and the method of visualization is determined by how the fields in the individual tabs will be filled. In this way, we are able to create relatively complex selections and visualizations without the need for knowledge of a programming language.

In the following section, we will describe the individual fields of the form for a better understanding of their functionality and meaning. It may happen that selecting a value in a field hides or shows some fields. It’s not a bug, it’s a feature.

Creating a KPI definition

A KPI (definition) can be considered as a separate object within the WorkSys platform, which can be worked with in different places of the platform. Visually, the main screen looks like this.

The basic parameters of each KPI definition are as follows:

Name

The user name for the given KPI definition and, as we are already used to, it is possible to enter different language translations for the Name.

Category

The Category field determines what will be visualized on the Component and has the following values:

  • Status – is used to count the devices corresponding to the selection according to the current value in the Status field. The status field should be included in every digital entity (device).
  • Other – serves to display all other fields of digital entities (devices)

Groups

The names of the relevant Groups are assigned to the Groups field (as well as by selection) from the left menu structure. It is for later easier orientation in the number of KPI definitions. Of course, it is also possible to assign more group identifiers, because it is logical that some KPI definitions are used for several purposes.

Chart type

The Chart type determines the visual form of data display and has the following options:

  • Pie chart – displays the value of an attribute other than Status and mostly serves to display the current value of several objects.
  • Gauge chart – displays the current value of the attribute on the dial semicircle (very often used for performance or consumption measurements)
  • Time scale chart – používa sa na zobrazovanie časového priebehu hodnôt jedného alebo viacerých atribútov digitálnych objektov
  • Table – this special component is used to display the measured and saved values of a digital entity (it can only be used for a specific digital object – Entity) with the option of exporting to a file in .csv or .xlsx format.

The visual part of the KPI definition, tabs and their fields

Tab - Chart visual options

In this section, let’s describe the fields that allow you to set the visual part of the KPI definition. All items are concentrated in the upper part of the tab Chart visual options.

The bottom image shows the basic ones for the Status Category, but with a different graph tip, some more may be added.

Description of individual fields:

Height

Represents the height of the component in points.

Note: We can mostly leave it in the original setting, because the size of the Component can be adjusted on the corresponding Panel through the lower corner with the mouse.

Width

Represents the width of the component in columns

Note: We can mostly leave it in the original setting, because the size of the Component can be adjusted on the corresponding Panel through the lower corner with the mouse.

Show legend (switch)

After switching on, the legend of the visualized values is displayed on the graph

Legend orientation

Determines where the Component legend is displayed relative to the vertical position. The options are Upper, Middle and Bottom.

Legend horizontal position

Determines where the Component legend is displayed relative to the horizontal position. Options are Left, Center, and Right.

Legend orientation

Determines how the Component legend is oriented. The options are Horizontal and Vertical.

Tab - Chart type specific options for Gauge chart

This is a visual preview of the fields for the Gauge chart. Gauge graph is used when displaying the current attribute value. Very often it is performance or consumption. Visually it looks like this.

This is a visual example of the fields for the Gauge chart, with an explanation of the properties of each field.

Min

Specifies the minimum value of the Gauge chart

Max

Specifies the maximum value of the Gauge chart

Number of decimals

Specifies the maximum value of the number of decimal places on the graph

Number of segments on axis

Determines the number of segments into which the graph is visually divided

Gauge coloring (Button)

Allows you to set the entire scale in color according to the user’s requirements

For the Time scale chart, the list of fields is as follows.

Aggregation interval

Specifies the time for which the data will be aggregated. The numerical size as well as the aggregation unit can be set right here.

Time window

Specifies the time period that will be displayed on the chart. If I set 2 days, then on the graph I will see the data for the last two days aggregated for the set Time Interval. The numerical size as well as the aggregation unit can be set right here. This field is only displayed when the Date Range and Floating Range radio buttons are turned off.

The values in the graph are continuously updated on the Board.

Date range

If the switch is off, the time width of the graph is controlled according to the set time window.

If the switch is on, it is possible to select an exact time interval with an accuracy of minutes.

Floating range

If the switch is off, the time width of the graph is controlled according to the set time window or the set date range.

If the switch is on, it is possible to select a dynamic time block from the Floating start value and define the number of such units through the value in the Floating window field. The size of the block corresponds to the size of the aggregation value, i.e. the exact time interval, accurate to the minute, from which the blocks will start to be loaded.

The values in the graph are continuously updated on the Board.

This model is preferably used for measurement in aggregation after work shifts.

Floating start

This field is displayed if the Floating range switch is on. From the set date and time, the data will be aggregated and visualized according to the size of the Time Interval, and the time just set represents the starting position from when the blocks will start to be logically counted.

Floating window

This field is displayed if the Floating range switch is on. The value of the floating window determines how many time blocks from the current time will be visualized backwards.

Number of decimals

This field determines with which decimal precision the values will be displayed.

Visual mapping (Button)

This field allows you to set the color levels of the visualized attribute value on the timeline. The interval does not have to be continuous.

Data selection criteria of KPI definition and their fields

This is what the initial screen looks like for setting the data selection to the chart.

The list of individual fields and their applicability is as follows:

Tabs Series1 – SeriesX

It represents separate selection criteria that are visualized as one graphic element (line, column).

For time graphs, it is possible to use the (+) button in the upper right to make more Series definitions sequentially numbered, which makes it possible to translate several types of data on one timeline.

Entities

One or more Entities or logical structure nodes can be entered in the Entities field, which will be included in the selection. In the case of a logical node, the selection includes all entities of the given type selected in the Entity Types field from the selected logical level, including all lower levels in a direct line.

Entity types

One or more definitions of object types can be inserted into the Entity Types field (but usually one object type is enough), and according to the selected object type, fields for selection and processing are subsequently offered in the next section.

Dimension

In the field Dimension, it is possible to insert an attribute (type string) contained in the structure Types of subjects, according to which the data will be additionally grouped. If the field is not of type string, the aggregation will not work.

Label

You can insert a Label (separately for each language) in the Label field, which will replace the numbers from the Series tabs in the legend.

Y axis index

 

With the Y-axis Index field, you specify on which Y-axis the scale should be displayed. The field allows you to choose from two values (Left axis and Right axis).

Note: The default is the left axis. This function is advantageously used if the values of the visualized fields are in individual series with a large nominal difference. If all the data were displayed on one axis, the dynamics of the curve would be lost at orders of magnitude lower values.

Visualization

Defines the way the Component data is visualized. It has the following options:

  • Line chart
  • Bar chart
  • Stacked Bar chart 

Note: A stacked column chart can only be used if the attributes to be stacked are in the same entity definition.

Example: If I want to visually display the separately registered consumption for phase no. 1 to phase no. 3 at one electricity measuring point.

Measure

The field allows you to select the attribute that will be visualized on the Component.

Note: In the case of a stacked bar chart, it is possible to select more than one attribute.

Only data changes (switch)

Only those data of the given attribute that came as input at the given time (time stamp) will be taken into account in the selection.

Note: It should be noted that it is not necessary to send all structure data to WorkSys at the same time, but it is also possible to send them time-selectively if, for example, a value changes. But the user always sees the last sent value on the digital point detail, but this does not mean that all the data was sent at the same time.

Aggregation function

Defines the method of data processing of the selected field (entity attribute). It has the following aggregation possibilities of the result in the given time interval:

  • Average (Average value)
  • Min (Minimum value)
  • Max (Maximum value)
  • Sum (Sums all values)
  • Lates value (The last value received from the device)

Legend unit

This field allows you to enter the unit in which the data is interpreted.

Note: If the definition of the object (entity type) has a unit assigned to the given attribute, it is automatically transferred to the field. But it is possible to modify it.

Restrictive selection criteria

Attribute

Specifies the field that will serve as the criteria for data selection.

Sign

Specifies the logical operator of the selection condition.

Value

Specifies the value against which the value of the attribute in the logic of the selected operator will be taken into account during the selection.

Through the button (+) at the end of the condition line, it is possible to insert more limiting criteria and all of them are logically connected by the logical operator AND at the same time it is true that  (which in the programming language represents the expression AND).

In the next part, the establishment and options for individual Categories and Chart Types are described in more detail. Due to the universality of the form, it is of course also possible to fill in illogical combinations, but you don’t have to worry about that. Nothing happens at all, you just don’t see anything 🙂 . In the next section, we will only deal with meaningful combinations.

Articles