Build and deploy your dashboard 

With your InfluxDB/script in place, you can now build & deploy your Grafana dashboard.

Grafana has a tutorial on panels, so we mainly focus on a few of the basics.

Table of Contents

Build and deploy your dashboard

Leverage the dashboard templates 

We recommend that you use our dashboard templates from the github repo as a starting point. These also let you see how various queries can be setup.

In particular, ensure you’ve managed to visualize the sample data from the github repository with the relevant dashboard template.

By using the dashboard template as basis for your own dashboard, the ‘Variables’ enabling dynamic dropdowns will also be setup already.

Set your time period 

In Grafana, you can specify what the default time period setting should be for your dashboard. You can set this to a fixed period (e.g. for testing) or a dynamic period (e.g. last 24 hours). When you save the dashboard, you can choose whether to retain the selected time period as the default. For details, see the Grafana docs.

Note

If you are unable to locate your data, try zooming far out to find it

Let users select what data to display via ‘Variables’

You can let your users change which device(s)/signal(s) to display data for via dropdowns.

To create a new dropdown, go to the dashboard settings (upper menu) and Variables/New. Add a dropdown name (e.g. DEVICE/SIGNAL) and add one of the below queries:

Query for devices dropdown

import "influxdata/influxdb/v1"
v1.measurements(bucket: v.defaultBucket)

Query for parameters dropdown

import "influxdata/influxdb/v1"
v1.fieldKeys(bucket: v.defaultBucket)

In your panel queries you can now use below syntax (example for devices dropdown):

from(bucket: v.defaultBucket)
  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)
  |> filter(fn: (r) => r["_measurement"] =~ /${DEVICE:regex}/)
  |> filter(fn: (r) => r["_field"] == "Speed")
  |> aggregateWindow(every: v.windowPeriod, fn: mean)
  |> yield(name: "mean")

If you want a panel where users can both select devices and parameters, you can use below:

from(bucket: v.defaultBucket)
  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)
  |> filter(fn: (r) => r["_measurement"] =~ /${DEVICE:regex}/)
  |> filter(fn: (r) => r["_field"] =~ /${SIGNAL:regex}/)
  |> aggregateWindow(every: v.windowPeriod, fn: mean)
  |> yield(name: "mean")

Display multiple parameters in one panel 

In the dashboard script, we showcased how to query a single parameter. In some cases, you may want to query multiple parameters. To do so, you can modify the query as below. You can then click on the legend-line of one of the parameters to change colors or switch to a 2nd Y-axis.

from(bucket: v.defaultBucket)
  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)
  |> filter(fn: (r) => r["_measurement"] =~ /${DEVICE:regex}/)
  |> filter(fn: (r) => r["_field"] == "Speed" or r["_field"] == "AccelerationX")
  |> aggregateWindow(every: v.windowPeriod, fn: mean)
  |> yield(name: "mean")

Panel plugins 

Grafana offers a large number of plugins on top of the basic panel types. For example, you install the TrackMap plugin to display GPS coordinates in a panel. Once installed, refresh your browser and find the plugin under your panel types. You can then use a query as below:

from(bucket: v.defaultBucket)
  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)
  |> filter(fn: (r) => r["_measurement"] == "2F6913DB")
  |> filter(fn: (r) => r["_field"] == "Latitude" or r["_field"] == "Longitude")
  |> aggregateWindow(every: v.windowPeriod, fn: median)
  |> yield(name: "median")

Note

To ‘time sync’ time series panels with the GPS map, you need to use the ‘Graph (old)’ plot type

Save & import dashboard templates 

You can easily export or import a Grafana dashboard via JSON files as explained here.

Note that you’ll need to modify the queries in imported dashboards to match your data.

Alert notifications 

Grafana lets you set alerts to notify if certain thresholds are exceeded for each of your panels - for more on this, see the Grafana docs. Note that when using alerts, you should add the below lines at the top of your panel queries:

windowPeriod = int(v: v.windowPeriod)
myWindow = if windowPeriod < int(v: 100000000) then 1s else v.windowPeriod

Tips & tricks 

See also our tips & tricks section for more details.

Next, optionally automate the script execution.