Tailwind CSS on GitHub

Templating variables


Variables enable more interactive and dynamic dashboards. Instead of hard-coding things like server or sensor names in your metric queries you can use variables in their place. Variables are shown as dropdown select boxes at the top of the dashboard. These dropdowns make it easy to change the data being displayed in your dashboard. Check out the Templating documentation for more information.

Datav's templating variables are almost the same as Grafana's, but there are differences, imagine that if multiple dashboards share a variable, how do you resolve this? So that's where Global variables are needed.

Dashboard variables

If you are already familiar with Grafana, then this part is almost the same as Grafana.

  1. Go to the dashboard you created earlier and open the Settings panel
  2. In the left navigation bar, select the Variable
  3. Click Add variable
  4. Fill in these: Name -> urlType -> Values separated by comma -> /user/login,/user/logout,/user/info`
  5. Click Add, then return to dashboard page

At this point, under the navigation bar, a 'URL' selection box appears and helps us automatically select '/user/login'. Next, use the 'URL' variable:

  1. Click on the top of the chart you created earlier. The current name should be 'Panel Title'
  2. In the pop-up drop-down panel, select Edit to go to the Edit Chart page
  3. In the Panel -> Settings -> Panel title, type in '$url'
  4. Click on the Apply Button in the upper right corner to return to the dashboard page
  5. Save dashboard

At this point, you should see that the title of the panel successfully uses the value of the current 'url' variable.

Because this is a local variable, it only takes effect on the current dashboard and is not visible when you switch to another dashboard

Global variables

Now let's add a global variable 'app' to represent the currently selected application, since an application may have multiple dashboards, and these dashboards should share a same app variable, in grafana, we need create app variable for each dashboardd, in datav, we can only do it once.

  1. On the left menu bar, select Configuration -> Global Variable
  2. At this point, you'll find yourself in an empty dashboard, because we're actually using the local variables of the dashboard as global variables
  3. Dashboard setting -> Variable -> Add variable
  4. Fill in these : Name -> app, Type -> custom, Values separated by comma -> sms,gateway,mysql
  5. Click Add, then return to dashboard page
  6. Save dashboard

To verify the effect, first set app to mysql in the current global variable dashboard and then go to the dashboard we created earlier. You will see the select box for 'app' in the upper right corner with the value already set to mysql.

At this point, our beginner's guide is complete, you can find more comprehensive and detailed content in the advanced tutorial series.