Dashboards “by objects”

Creating a widget

• Line chart – a chart of data changes over time. This widget can be used to track temperature, energy consumption, and other sensor readings;
• Pie chart – a circle divided into sectors, where each sector reflects the share (percentage) of the value of one argument relative to the sum of the values of all arguments selected as a data source. This widget allows you to quickly compare a small set of values and evaluate the share of each value compared with other sectors and with the entire pie chart. For example, it can be used to display the duration of equipment operation in different modes, or incident causes by category;
• Gauge chart – a half-ring chart divided into sectors, where each sector reflects one of the levels set in the model for the argument selected as the data source. This widget allows you to quickly see which interval the value falls into within the specified range. For example, it can be used to display the speed of a vehicle within established limits;
• Percentage – a ring chart where the percentage fill share for the argument selected as the data source is highlighted in color along the circumference. This widget makes it easy to visualize a value in the range from 0 to 100 percent. For example, it can be used to assess battery charge, task completion progress, or equipment load level;
• Bar gauge chart – a chart in the form of vertical or horizontal bars, where the height or length of each bar corresponds to the value of the argument selected for it. This widget is convenient for creating a ranking when values need to be compared with each other and attention needs to be focused on the best and worst indicators, or for comparing values across different categories;
• Counter – the numeric value of an argument with a specified color, which can change according to levels;
• LED – a virtual LED that signals the state of an argument;
• Battery, Flask, Thermometer – schematic images of a battery, flask, and thermometer respectively, where the percentage fill share for the argument selected as the data source is highlighted in color;
• Text – plain text or text in Markdown format. This widget allows you to add contextual information and descriptions. For example, it can be used
  • for important links or useful annotations;
  • for instructions or recommendations on interpreting various widgets, configuring parameters, or performing specific actions based on the displayed data;
  • for an announcement about scheduled maintenance or downtime;
• Slider is intended for sending a command with a variable numeric value. For example, it can be used to change light intensity, engine operating speed, or to set a specific program number;
• Switch is a two-position button for turning something on/off;
• Button is intended for sending any object command;
• Stepper, like a slider, allows you to send a command with a variable numeric value, but in this case the value can be changed only by a predefined step;
• The Color widget is well suited for selecting an exact color using the RGB scheme — for example, for setting the color of an LED or lamp.

Line chart

💡

To configure the chart style, go to the widget Display settings and use the Style, Line width, and Point radius options. The Widget preview section will show a chart corresponding to your settings. When you finish editing the widget, click Save.

Pie chart

Gauge chart

• MIN/MAX – the minimum/maximum value for the selected time period;
• FIRST/LAST – the first/last value for the selected time period;
• AVG – the average value for the selected time period;
• DIFF – the last value minus the first value over the selected time period;
• SUM – the sum of all values received by the object during the selected time period.
  You can enable Show edge intervals mode; then the ring chart will be divided into colored sectors according to the levels set in the model for this argument. If this mode is disabled, the chart is fully colored in the color of the level corresponding to the displayed argument value. If the selected argument does not yet have levels set in the model or the interval boundaries and their color do not suit you, click Go to the model and customize levels. After saving the new levels in the model, the sector colors on the chart will also be updated.

Percentage

Bar gauge chart

💡

If the chart is used to visualize changes in an argument's value over time, consider setting a maximum value in the display settings. The bars will then be scaled relative to this maximum, making it easier to track progress and evaluate changes at a glance.

If the maximum is not set, then by default the largest current argument value in the bars is taken as the maximum.

Counter

LED

Battery, Flask, Thermometer

💡

By default, the fill on the widget is calculated based on 0 being the minimum value and 100 being the maximum. If the actual boundary values are different, set them in the display settings.

In this case, the percentage of color fill on the widget is calculated from your values.

Text

Slider

💡

In the list of commands available for selection, only those are present that have exactly one parameter set in the model, whose value can be specified directly when sending the command. To create such a parameter, when creating the command in the model, it must be declared in curly braces {{param_name}}.

The same commands are used as data sources for the Stepper and Color widgets.

Switch

Button

💡

Use actions that require confirmation for commands whose accidental triggering may lead to unpleasant consequences. Then, before sending the command, you will be able to confirm or cancel the selected action.

Stepper

💡

You can select the required number not only using the control buttons, but also by entering it manually.

Color

💡

You can select the required color using the palette, eyedropper, or one of the color models.

Regardless of the selected method, the color is sent in hexadecimal format.