Line Charts and Double Axis widgets are a perfect match to visualize time series data in Ubidots. Both widgets have options to display and customize data visualization as require by each individual application. Color, time span, aggregation method, among others, are the options available within these two widgets.

Table of Contents

1. Create and setup a Line Chart widget.
2. Create and setup a Double Axis widget.

1. Create and setup a Line Chart widget.

Line Chart widgets allows to easily visualize time series data from one or more variables at a time up to 10 variables. Within the settings options, trace color, aggregation method, time span, among others, can be found. All of these to fit your desired visualization and application requirements.
Following the below steps you will be able to create and configure a Line Chart widget as you see fit:

Step 1: Click on the top-right corner "+" to add a new widget.
Step 2: Select
Line Chart widget.
Steps 3: Search a device and select one or more variables.
IMPORTANT NOTE: if your dashboard is dynamic and so the Line Chart widget, you will need to enter the variable label the dashboard is going to look for within the selected device.

Step 4: Select the Aggregation Method for each variable to compute maximum, minimum, count, average or sum based on the variable's data over a selectable time span or let the span be defined by the Dashboard, or simply display variable's raw values.
Step 5: Choose a time span for each variable. Option "Set by dashboard" correspond to the Dashboard's general date time picker span, whereas "Last values" let's you defined the amount of historical values (dots) to b displayed, up to 10,000 dots.
Step 6: Configure the widget appearance:

  • Name: Input a tittle for the Line Chart Widget.
  • Y-min and Y-max sets limits for the Y-Axis.
  • Decimal points to display in the tooltip.
  • Date time format to display in the tooltip.
  • Show seconds  toggles ON/OFF seconds on the tooltip.
  • Chart type: choose the type of trace between line, dots or bars.
  • Visualize as an step line chart switches the line chart to bound subsequent dots in a squared fashion rather than drawing a straight line.
  • Show legends enables/disables legends for each variable.
  • Display X-Axis data zoom switches ON/OFF the X-Axis zoom bar. 

2. Create and setup a Double Axis widget.

While the simple Line Chart widget only have one Y-Axis and can allocate up to 10 variables, Double Axis widget has 2 Y-Axis, one in each side, and only support 2 variables at a time.
Follow the below steps to create a Double Axis widget:

Step 1: Click on the top-right corner "+" to add a new widget.
Step 2: Select
Double Axis widget.
Steps 3: Add the two variable to be displayed.
IMPORTANT NOTE: if your dashboard is dynamic and so the Double Axis widget, you will need to enter the variable labels the dashboard is going to look for within the selected device.

Step 4: Configure the widget appearance:

  • Name: Input a tittle for the Double Axis Widget.
  • Y-min and Y-max sets limits for the Y-Axis en each variable, individually.
  • Decimal points to display in the tooltip. for each variable.
  • Date time format to display in the tooltip.
  • Show seconds  toggles ON/OFF seconds on the tooltip.


Other users also visited:

Did this answer your question?