Charts are a very powerful way to visualize your data and look for insights. Charts are very easy to be configured, you just need to select the variables and to define the time settings to exhibit the data.

Multiple Axis charts

This kind of chart allows you to plot your data using bars, lines, columns and areas in the same chart. Therefore, you will have to set the type of your chart for each variable you add on it. Besides that, you will also have to choose which time settings to use.

Color

Users can change the color of the lines in the chart.
To do so, you need to send the color in the metadata of the variable.

[
  {
    "variable": "var1",
    "metadata": {
      "color": "green"
    },
    "value": 22
  },
  {
    "variable": "var2",
    "metadata": {
      "color": "blue"
    },
    "value": 32
  }
]

The example above sends two variables with the colors green and blue, see the image below.


Edit Options

Data Range & Format

  • Maximum number of points to be displayed: this option will help you to filter exactly the amount of data you need, while it still keeps showing the most recent ones.
  • Y Axis: You can customize how the vertical axis of your chart will be displayed. You can abbreviate values in the scale range if they are too big by selecting the Apply metric prefix abbreviation option.
  • Number format: this option is configured for each variable in your widget. You can select if you want to show the thousands separator in the number (3.500 instead of 3500) and how many decimal places the number will have. Keep in mind the thousands separator is defined in your Account Settings

Visualization

  • Stack graphics: this option determines whether to stack the values of each series on top of each other.
  • Show value for each point: By enabling this option, each point in the chart will show its value on top of the line. Like so:
  • Group the samples by: by default, the X axis of the chart will be the time of the values. But, sometimes you need to group your data through the X axis even if they don’t have the exactly same time, in that cases you must make use of "serie".
  • Show device name associated with each variable: this option tells the chart to show the device name near the variable name. It’s useful when you have variables with the same name in the chart.

Filter by date

The developer can pre set some date filters for the data to be displayed, the dates can be personalized to better suit the application needs. The result can be seen in the green box in the image below

To display the date filter, the developer must go to the section Advanced Options when creating or editing the chart widget, select the number interval, then select the interval from the options:

  • second
  • minute
  • hour
  • day
  • week
  • month
  • year

The image below shows the advanced options configuration