Custom Widgets

With Custom Widgets, you can create your own widgets that are precisely tailored to your needs. The advantage over preconfigured widgets is that you can in Custom Widgets

Basic Principle

A Custom Widget consists of several modules. You can assemble as many of these modules as you like into a widget. You can also customize the individual modules in detail.

In Fig. 1, you see an example of a Custom Widget consisting of the following modules (from top to bottom):

  • Analog Trend

  • Heatmap

  • Donut

Fig. 1: A preview for a Custom Widget with 3 modules

Step-by-Step: Create a Custom Widget

Step 1 – Create a Custom Widget

Follow these steps to create an "empty" Custom Widget.

  1. Make sure you are in the "Dashboards" menu item

  2. In the context bar, click on "Widgets"

    ▷ The widget selection opens

  3. Click on Custom Widget

  4. Enter a name

  5. Select an icon. This icon will later appear in the title bar of the widget

  6. Click on "Confirm"

    ▷ The new widget has been created

Step 2 – Customize the New Widget

After the widget has been created in step 1, you can make the first adjustments.

Fig. 2:

[A]

Back/Cancel

Return to the widget overview, without saving.

[B]

Name

You can adjust the name here afterward.

[C]

Icon

You can adjust the icon here afterward.

[D]

Save

Save inputs.

[E]

Preview

A preview of what the created widget will look like.

[F]

Add module

Click here to add modules to the widget.

[G]

Set test data

Click here to set test data. Explained in more detail under -> Set test data

[H]

Alarm data

If this box is checked, the alarms of the asset that was defined under "Primary Asset" will be displayed in the widget. The "Primary Asset" is specified when you have finished configuring the Custom Widget and add it to the dashboard. See X

Step 3 – Add a Module

Fig. 3: The module selection
  1. Click on [F] to add the first module to the new widget.

    ▷ The module selection (Fig. 3) appears

  2. Move the mouse over a module to display a short description

  3. Click on a module to add it to the Custom Widget

    ▷ The preview [E] of the widget is updated with the new module.

    ▷ The module options [I] (Fig. 4) open

  4. Configure the module in the module options [I]

  5. Click on the Save button [J] to save the settings of the module or click on [K] to cancel.

A detailed explanation of the configuration options for each module can be found in the chapter -> Modules

Fig. 4 – Module with module options

Step 4 – Add and Arrange More Modules

  1. Click on [F]

    ▷ The module selection (Fig. 3) opens.

  2. Click on the module that you want to add to the widget

  3. Proceed as explained in step 3 to configure the new module.

Rearrange Modules

You can arrange modules within the Custom Widget as you like.

  1. In the preview [E], click on a module.

    ▷ The module is bordered in black

  2. Click on [L]

    ▷ The module is moved up

  3. Click on [M]

    ▷ The module is moved down

Delete Modules

You can delete a module from the Custom Widget.

  1. In the preview [E], click on a module.

    ▷ The module is bordered in black

  2. Click on [N]

    ▷ The module is deleted

Set Test Data

You can simulate what your new Custom Widget will look like when it has been filled with data.

To do this, use the Set test data function [G]

  1. Make sure you are in the "Dashboards" menu item

  2. In the context bar, click on "Widgets"

    ▷ The widget selection opens

  3. Click on the Custom Widget for which you want to set test data

  4. Click on Set test data [G]

    ▷ The "Test Data" window appears (Fig. 5)

  5. Make the desired settings

  6. Click on Continue [S]

    ▷ You will see the simulated data in the preview [E]

The simulated data only affects the preview of the Custom Widget.

The simulated data is only for a better overview of what a finished Custom Widget will look like.

The simulated data has no influence on the Custom Widget after it has been created and saved.

Fig. 5 – "Test Data" window

[O]

Asset

Simulates the display of the title of the Primary Asset in the Title bar [T] (Fig. 6)

[P]

Alarm

Simulates the alarm level in the Widget icon [U] or the Title bar [T] (Fig. 6) Available values:

  • 0: No alarm

  • 1: High alarm level / Title bar [T] turns red

  • 2: Medium alarm level / Yellow symbol in the widget icon [U]

  • 3: Low alarm level / Green symbol in the widget icon [U]

[Q]

Time span

Only effective for certain modules, e.g. Trends. Changes the scaling of trends, the same effect is caused when [V] is pressed.

[R]

Number of assets

Only effective for certain modules, e.g. Donuts. Simulates how the module changes when more assets are linked to it

[S]

Continue

Apply inputs and close the "Test Data" window

Fig. 6

Last updated