Creating Widgets  

To add widgets when creating a new dashboard:

1. Go to the End Application.

2. Select Dashboard from the application's main menu on the left pane.

3. Click the Add Dashboard button in the top-right corner. The Widget's welcome screen is displayed.

4. Click the OK button, and select the required widget type from the left panel.

5. Select the required widget from the widget gallery.

6. Configure widget properties. Widget properties are different for every type of widget. Refer to the documents under Different Types of Widgets for more details on creating each widget.

7. Click Create to add the new widget to the dashboard.

To add widgets using the Add Widget option from the dashboard view:

1. Go to the End Application.

2. Select Dashboard from the application's main menu on the left pane.

3. Select the dashboard to which you want to add the widget from the dashboards drop down list.

4. Click Add Widget from the Actions button.

5. Select the required widget type from the left panel.

6. Configure widget properties. Widget properties are different for every type of widget. Refer to the documents under Different Types of Widgets for more details on creating each widget.

7. Click Create to add the new widget to the dashboard.

 

To add widgets using the Edit Layout option from dashboard view:

1. Go to the End Application.

2. Select Dashboard from the application's main menu on the left pane.

3. Select the dashboard to which you want to add the widget from the dashboards drop down list.

4. Click Edit Layout from the Actions button.

5. Select the required widget type from the left panel.

6. Configure widget properties. Widget properties are different for every type of widget. Refer to the documents under Different Types of Widgets for more details on creating each widget.

7. Click Create to add the new widget to the dashboard.

Availability

All Widget operations require necessary permissions. Refer to Users and Profiles document for more details.

Check Feature Availability and Limits

Editing Widgets 

1. Select the dashboard in which the widget to be edited is present.

2. Click on the vertical ellipsis button and the Edit option to display the widget configuration screen with the current values.

3. Modify the required values.

4. Click Save.

Note: You can modify the style of a widget to another compatible style by using the Change Style option. Similarly, you can modify the time frame of period-based charts, graphs etc.  

Cloning Widgets

1. Select the dashboard in which the widget to be deleted is present.

2. Click on the vertical ellipsis button on the widget, then select the Clone option from the drop down menu.

3. Modify any required values. 

4. Click Create.

Deleting Widgets  

1. Select the dashboard in which the widget to be deleted is present.

2. Click on the vertical ellipsis button on the widget, then select the Delete option from the drop down menu.

3. Click Delete in the confirmation window.

Changing Widget Styles 

Inline Switching  

Note: The switching of widget style is for temporary viewing only and therefore the view is not saved anywhere. The widget is displayed in its original style when the client interface is refreshed.

The steps to be performed for Inline switching are provided below:

1. In the dashboard view, click the widget's Change Style image icon as shown in the above image. The compatible styles are displayed as options in the drop down list.

2. Choose the desired style.
   

Configuration Switching

To switch style based on configuration switching:

1. In the dashboard view, click on the vertical ellipsis on the top right corner of the widget

2. Click Edit to invoke the Edit Widget screen.

3. Click Change Style link below the sample image on the left.

4. Choose the desired style.

5. Modify the values you want to change.

6. Click Save.  

Advanced Options 

 Note: The following widget have color code options to improve aesthetics and readability of the widgets. 

1. Card
   
2. Custom Fill
   
3. Image Cards
   
4. Calendar 
   
5. Commands
   
6. Button

Ranking/Sorting  

Adding KPI Bar  

 Note: The KPI Comparison bar is available for only Timeseries Group chart. 

Configuring KPI Bar 

 
Adding Threshold Line  

Note: Multiple threshold lines can be used in a graph to visually distinguish between different performance levels or alert conditions.

Configuring Threshold Line Color

 Note: The Threshold Line setting is available for both Timeseries Group charts and Instance Property Group charts. 

Configuring Threshold Area

The color of the area above and below the threshold line can be set while adding the line.

Adding Axis Setting 

Configuring Axis Setting

When data falls outside the defined interval in a custom axis range, there are two possible approaches:

1. Dynamically adjusting the axis range to accommodate all data points.
2. Displaying only the data that falls within the given range.
   

This flexibility helps in maintaining a focused and meaningful visualization.

Adding Comparison

Time grouping-based comparison allows you to visualize and compare data trends across different time periods such as days, weeks, months, or years in Line, Area, Bar, and Column charts.
 

 

Image: Sample chart displaying the comparison of fuel consumption vs fuel level in a line chart.

 

 

Configuring Comparison Chart

The configuration setting for a comparison chart can be done by selecting two Y-axis parameters.

 

Multi-axes charts allow all measures to be represented with separate axes, ensuring better clarity when visualizing multiple metrics. Using custom axis range within multi-axes helps users to manage the range for selected metrics, tailoring the display to specific data intervals.

When data falls outside the defined interval in a custom axis range, there are two possible approaches:

1. Dynamically adjusting the axis range to accommodate all data points.
2. Displaying only the data that falls within the given range.
   

This flexibility helps in maintaining a focused and meaningful visualization.

Applying Colors to Widgets 

Static Color

1. Colored widget

2. Show color only in header strip and icon

3.Show color only in icon holder

Dynamic Color

 Note: The Apply Color feature changes in behavior based on the widget type and style. 

Hide Title 

The Hide Title option is used to hide the widget title.

Image: Devices Count Card widget with title "Devices".

Image: Devices Count Card widget without a title.

Color Scheme for Metrics

For Dial and Chart Widgets, the color scheme is configurable for each metric.

Hide Values for Metrics

Select the option Hide Data Values to hide the values displayed on any widget.

Image: Dial Widget with and without values displayed.

For step by step illustration on working with any specific type of Widget, refer to the Understanding & Working With Different Types of Widgets document.

Configuring Dynamic Description 

Dynamic description in Simple Card widgets allows the displayed text to change automatically based on the data value ranges, providing contextual insights at a glance.

1. The card widget description can be configured to change dynamically based on the value range of data received.
   

Image: Sample card widget with dynamic description. Different description will be displayed for higher/lower values as configured.

Image: Sample card widget description configuration. 

Configuring Fonts

1. The fonts and size of texts in the Card Widgets can be customized as desired.
   
   

Image: Sample card widget description configuration
 

Image: Sample card widget increased value size