Documentation

Create dashboards and widgets

Last Update:

Step 3: Create a dashboard

 

In this step, we will create a dashboard and add some widgets to display the information graphically.

 

1. Create a blank dashboard

 

To create a blank dashboard, follow these steps:

  • Open the Dashboard Group page.
  • Click on the "ALL" group. In the opened window, click on the "Open Dashboard Group" button to enter the dashboard page.
  • Click the "+" sign in the upper right corner of the screen and select "Create a new dashboard".
  • Enter the name of the dashboard. For example, you can use "MyNewDashboard". Then click "Add" to add the dashboard.
  • Since, Thingspod, by default sorts the list of dashboards based on when they were added, the dashboard that was added should be in the first row. Now click on the dashboard login icon.

 

 

2. Add aliases for entities

 

Aliases are known as a reference to a single entity or group entity. They will be used in widgets. Aliases can be fixed or variable. For simplicity, we will use the Single Entity type, which will refer to only one entity (MyNewDevice). Aliases can be defined to refer to more than one device. For example, data or properties related to devices of the same type, or devices associated with an asset (eg an apartment), can be used in widgets with an alias.

 

To add an alias, follow these steps:

  • Enter the dashboard editing mode by clicking on the "pencil" icon in the lower right corner.
  • Click on the "Entity Aliases" icon at the top right of the screen. You will see that the list of entity aliases is empty and has no members.
  • Click the "Add Aliases" button.
  • Enter an alias, for example, "MyNewDeviceAlias". Set the filter type to Single Entity. In the Entity Type section, select Device. In the Device Name section, start typing the name of the device you added, so that the auto-completion mode is activated and it shows you selectable options. Select the desired device by clicking on it.
  • Click the "Add" button and then click Save.
  • At the end, click on the Apply Changes button, whose icon is located in the lower right corner of the screen, to save the changes. After that, you need to enter the editing mode again to continue editing the dashboard.

 

 

3. Add a table widget

 

To add a table widget, we need to select it from the widgets library. Widgets are grouped into groups. Each widget has a data source. In this way, each widget will know what data to display. To see the last temperature data value that was sent to the platform in the second step, you need to set the widget's data source.

 

To add a table widget, follow these steps:

  • Enter dashboard editing mode.
  • Click on the icon "(+)" to add a new widget in the lower right corner of the screen.
  • In the opened menu, select the card widgets. Then, select the Entities table widget. The widget settings window will open.
  • Click the "Add" button to specify the data source. A widget may have multiple data sources, but here we use only one data source.  Set the Type to Entity and select the alias "MyNewDeviceAlias". Then, by clicking on the right box, auto-completion is activated and allows you to select available data points. Since you sent data with the temperature key to the platform in the previous steps, you will find it here. Select it and click "Add".
  • By moving the mouse pointer on the edge of the widget, you can drag its corner, resize it, and change its location. You can also apply more specific and advanced settings to this widget by entering its settings.

 

After finalizing the settings and determining the location and size of the widget, apply the changes and exit the dashboard editing mode. Now you can submit new data and see it instantly in the table.

 

 

4. Add a chart widget

 

To add a chart widget, we need to select it from the widgets library. The chart widget displays multiple historical values of data (here, temperature). To use the chart widget, you must also set the time window for displaying the information. Enter dashboard editing mode.

  • Click on the Add new widget "(+)" icon at the bottom right corner of the page and then click on the "Create new Widget" icon.
  • In the opened menu, select the chart widgets. From the available widgets, select the Timeseries – Flot widget. The widget settings window will open. In the opened window, click on the "Add data source" button.
  • Set the Type to Entity and select the entity alias "MyNewDeviceAlias". Select the temperature data key and click "Add".
  • Drag and drop the graph widget to the location and change its dimensions.
  • Repeat the second step several times here and send some new data. Keep in mind that by default, the widget shows only the data for the last minute.
  • Open the Edit time window from the upper right corner. Change the data display interval value and cumulative function type, update the time window, and save the changes.

 

After finalizing the settings and determining the location and size of the widget, apply the changes and exit the dashboard editing mode. Now you can upload new data and see it instantly on the chart.

 

 

5. Add an alarm widget

 

To add an alarm widget, follow these steps:

  • Enter dashboard editing mode.
  • Click on the Add new widget "(+)" icon in the lower right corner of the screen, then click on the "Create new widget" icon.
  • In the opened menu, select the alarm widgets and then select the Alarms table widget. The widget settings window will open.
  • Set the Alarm source field to Entity, select the alias "MyNewDeviceAlias", and click "Add".
  • If you don't see the newly added widget on the dashboard page, scroll down and find the alarm widget you added. Now you can drag and drop it in the place you want and determine its dimensions as well.
  • After determining the position and dimensions, apply the changes and exit the editing mode.

 

After applying the changes, the alarm widget will be successfully added. Now, it's time to set alarm rules and create alarms.

 

 

Previous

Add and connect device

Next

Create Alarm Rules

© 2024 ThingsPod. All Rights Reserved.