UniCloud Widgets – Overview

Widgets enable you to display data from multiple Assets on your Dashboards.

Using widgets, you can display static images and text, dynamic values from a single tag, as well as geographic location and alarm status. You can display data tag values in tables and in graphic charts.

Widget options differ from widget to widget, but all widgets offer options to customize appearance, and all allow you to set up Navigation, allowing a user to jump to another Dashboard.

Widgets that display tag values and asset properties offer a Scope option. The following table shows the list of available widgets.

Widget Table

 

 

Scope

Widget

What you can display

Aggregated

Last

Raw

Table

Assets’ Tag data in Table form, including timestamp & date, Asset Properties

x

x

x

Alarms

Assets’ Alarm Status in Table form, including Alarm index, Active Status, Severity, timestamp & duration, Asset Properties

x

x

x

Image

A fixed, uploaded image

 

 

 

Image by value

Images according to the current value of a single Boolean or Numeric tag.

x

x

 

Text

Fixed text

 

 

 

Value

Data from a single tag

x

x

 

Conditional Value

Data from a single tag is displayed according to the current value of the tag, displays values including icons, colors, and text assigned to a range.

x

x

 

Update Asset

Update Asset widgets enable a dashboard user to directly access a controller and modify tag values, writing the new values to the controller memory.

Switch

A Switch widget enables a dashboard user to directly access a controller and click a button to modify a single Boolean tag value, changing the value in the controller memory.

Columns

Graphically express Assets’ Tag data, as a columns chart, along an X, Y axis, including timestamp & date, Asset Properties

x

x

 

Pie

Graphically express data from a single tag, as a pie chart

x

x

 

Line

Graphically express data from a single tag, as a line. 1 line widget per dashboard

x

 

x

Radial Gauge

Graphically express the data from a single tag as a radial gauge.

x

x

 

Linear Gauge

Graphically express the data from a single tag as a linear gauge.

x

x

 

Progress Bar

Graphically display the current value of a single data tag in relation to a maximum value which you set in the widget

x

x

 

Map

Shows the Geographic location of one or more Assets on a map. When the user moves the cursor over the Asset on the map, a popup displays data according to tags you select in the widget

VNC

(UniStream only)

Display a VNC window showing a specific Asset’s PLC.

Web

(UniStream only)

Display a window showing a specific Asset’s web pages

 

How to Place and Configure Widgets

To place a widget on the Dashboard Editor drag & drop it onto the canvas. The widget Wizard opens automatically to lead you through the steps of widget configuration.

When you are done, drag the widget to position, and drag the widget’s borders to resize it. You can toggle Show/Hide grid to aid you in positioning widgets.

Note that if you include the User Filters widget, it is automatically placed at the head of the Dashboard, and cannot be moved or resized.

 

1

Widget Ribbon

You can either click a widget to open it or drag & drop it onto the canvas; in either event the Wizard opens to walk you through the stages of configuring the widget.

Click the arrows at the ends of the Ribbon to scroll through the list of widgets.

2

Canvas

This is the design area for the Dashboard.

Note that if you include the User Filters widget, it is automatically placed at the head of the Dashboard, and cannot be moved or resized.

3

View

Show/Hide Grid: use this to toggle the grid on/off when you are working on the Canvas.

4

Clipboard

To copy widgets:

1.        Click the Copy icon on the widget; it will appear in the Clipboard.

2.        Drag it from the Clipboard.

3.        Drop it in the desired position; the Wizard will open automatically for you to make changes.

Note that the widget remains on the clipboard, and can be used multiple times. It will remain on the Clipboard until you copy a different widget.

 

 

Widget Wizard

The automatic Wizard is specific to each widget, and only shows you the available options. In the case of the:

All other widgets include the steps shown in the image in Step 1 below.

When you complete a step, the Next button on the bottom right becomes enabled; click it to continue to the nest one. You can click on the step numbers to navigate back and forth between completed step.

Step 1 Data

Here you select the Asset Type, the Asset Properties, and the Tag Data for the widget.

Step 2 Scope

Select the widget Scope.

Scope determines which data is displayed, and how it will be displayed.

Scope options depend on the widget type you select; UniCloud disables (greys out) any options that are not available.

Scope types include:

Make your selection, and click Next.

Step 3 Organize

The Data Tags and Asset properties selected in Step 1 will be shown in under Available Data.

The options for Organization depend on the widget type, and also on the Scope you have selected for the widget.

All of the selections you make are reflected in the Preview window.

Group By

Not all widgets offer the Group By option; in addition, some widgets do not offer it if Last Data is selected for Scope. Where available, use the drag handle  to drag & drop your selections into the Group By field. In widgets that allow multiple entries, you can drag your selections into a different order.

Note that if a drop-down arrow is displayed, you can select a specific data property; in the following image Daily has been selected for Data Timestamp.

Data and Metrics

Drag the data you want to show into the Data and Metrics field. Note the drop-down arrows that enable you to perform calculations on the collected tag data.

After you drop a tag into the field, click the drop-down arrow and select the calculation, or calculations, to display; each selection becomes a column heading.

Calculations include Min, Max, Delta, Count, Sum, and Average.

 

In widgets that allow multiple data, you can drag your selections into a different order.

 

Multiply (or Divide) by Factor

You can apply a factor to multiply or divide the value of a numerical tag or aggregated data, in order to display the modified values on Dashboards.

To apply a Factor:

As you edit your selections, the Data Preview will adjust the values to show your changes.

 

Widget Filters

Not all widgets offer filtering.

Widget filtering will be limited by any Dashboard Filter setting, as well as by the User Filter Widget.

Use the available options to filter your data and display it according to your selected parameters, such as time, date, or size.

To filter data:

 

Sorting

If a widget offers sorting you can use the options to display your data in a specific order.

To sort the data:

 

 

Customization

You can customize your widgets to effectively display your data, according to your dashboard requirements. As you work, the Preview shows your changes.

 

Configuration Options

You can:

Other Customization options differ according to widget type;

Refer to the Overview topic of each widget type for details.

Color Picker

The color picker works on the same principles for all Dashboard elements.

The following image shows a shade of red being applied to a table row background.

 

Navigation

All widgets offer Navigation.

Navigation enables you to configure which dashboard UniCloud will display in response when a user clicks on a widget.

Below, an image widget is set, when clicked, to jump to the Maintenance Dashboard.

Multiple Asset Types

Navigate by Asset Type

In the next image, a Table widget has been configured under Data to include two Asset types.

When a user clicks on an:

 

Navigate by Asset Type, Filter by Asset ID

In the next image, Navigation is mapped by Asset Type, and is also filtered by ID.

When a user clicks on an:

Resize & Reposition

The widget you have just configured will be displayed at its default size.

You can drag it to reposition it on the dashboard Canvas, and drag the widget borders to resize it. Your screen may resemble the image below: