As the hub of your IoT operation, the dashboard is the place from which you keep track of the process, object or place you're monitoring. The dashboard is comprised of widgets that allow you to plot data according to your needs, and every widget has a different set of configuration options. Depending on the widget, you might be able to add one or several variables. For instance, the metric widget only supports one variable, while the line chart widget supports multiple variables.

When a device is selected from the setting bar, then all variables within each widget will automatically update to reflect the device’s variables. This is achieved because Dynamic Dashboard widgets are not associated with predetermined variables; instead, they are associated with variable labels (i.e. label = temperature).

This is a very helpful enablement as it erases the need to create additional dashboards per device. Imagine you have a fleet of 1,000 trucks; with static dashboards you’d have to create 1,000 dashboards. With dynamic dashboards, you only have to create one dashboard, and then have the App's Users select the device for which they want to see the data:

Within the options to create a dynamic dashboard, you can choose which devices are going to be displayed in the drop-down list:

IMPORTANT NOTE: The map widget will display only the devices of the list.

Ubidots allows you to combine static and dynamic widgets at will. Using our Truck Application example, imagine you have a variable with the aggregated fuel consumption across all thousand trucks. You want this variable to be displayed in every truck’s dynamic dashboard, regardless of the selected truck. In this case, you would create a static widget pointing to a preset variable. 

To better understand the difference between static and dynamic, here’s a table explaining how a widget behaves when it’s created within a static or dynamic dashboard:

Step 1: To create a dynamic dashboard, go to "Data" –> "Dashboards"

Step 2: Click on the "dashboard" icon in the top-left of the user interface:

Step 3: Then click on the "+" icon:

Step 4: Assign a NAME to your dashboard and provide some general settings:

IMPORTANT NOTE: Customizing your Date format.

You can enter your own Date format using a parsing string as described in the Moment JS library. Below you can find quick parsing strings and examples:

Examples:
– "D/MMM/YY H:m:ss.SSS" – "22/Feb/19 14:57:40.369"
– "YYYY-MM-DD hh:mm:ss A" – "2019-02-22 03:01:08 PM"

Notice that non alphanumeric characters such as "/", ":" or "–" are parsed literally to the resulting Date format.

Finally, click on the save button in the lower right of your screen.

Common to both types of dashboards, there are 4 general options to interact with them and the data being displayed, where each outputs a different result, ranging from visualization changes, to real-time update enablement/disablement. 

Here's a description and each of the interaction options, as seen from left to right in your dashboards. :

– Date time picker: allows selecting a time range to populate the dashboard with data contained within the range.

IMPORTANT NOTE: widgets "Span" option must be "Set by dashboard" in order to react to the selected range, otherwise, it will always show a fixed time span.

– Full-screen mode: makes the dashboard fill the whole screen by hiding both the top Navigation bar and the Context bar.

To exit this mode, simply hit the "Esc" key or click the "Exit full-screen" button.

– Refresh: clicking this option will cause the dashboard to retrieve the most up to date data. This is particularly useful when the real-time functionality (next option) is disabled.

– Enable/Disable real-time: dashboards have the benefit of real-time update, meaning every time a new Dot comes in, it will be automatically reflected in the dashboard and its respective widgets. Sometimes it is useful to disable this feature to have a fixed time range and analyze that period without disturbing it with new data. To switch between real-time or not, just click the option accordingly.

Step 1: to create a static or dynamic widget, click on the “+” icon in the top-right corner of the dashboard user interface.
Step 2: select the type of widget from the available options, or create your own with the HTML Canvas.
Step 3: select the widget behavior: static or dynamic.
Step 4: assign a variable for the widget by clicking on + ADD VARIABLE(S), for dynamic widgets you can edit the variable label manually.
Step 5: configure the widget appearance and save.

This option allows you to apply an aggregation method (average, count, last value, max, min or sum) over the time range set in the dashboard's settings bar. 

Imagine you're measuring water consumption in an agricultural field and you want to create a dashboard for your customers to know the water consumed in a specific time range. You would then create a Metric widget with "sum" as aggregation method

The widget will automatically sum all values within the time range specified in the dashboard's settings bar.

The following widgets have an option to apply a method of aggregation.

Some of these widgets also give you the option to override the dashboard's time range (a.k.a "Set by dashboard"), allowing you to force the aggregation to always be computed for a predetermined time range:

Widget Appearance

Every widget has a different set of options for appearance, the most common ones being: 

For Dashboards, widgets have the following interaction options that allow users to have a better experience and easily navigate. 

– Download a CSV file with the data of the variables(s) related to the widget. You have to select the date range and the columns you want to export.

– Explore data of the variables or devices related to the widget, once selected, a new window will open with the device or variable view.

– Enlarge the widget to see it in more detail.

–Duplicate a widget in the dashboard, save time  creating a new one with the same configuration.

– Share widgets through a public URL or an embeddable snippet code for a website's HTML source code. For more information please refer here. 

– Edit widget configurations.

– Export PNG image of the widget in the selected date range.

– Delete a widget permanently.