Skip to main content

Variables

The Business Text panel provides helpers to support variables. You can use variables in the JavaScript code and CSS styles.

We thoroughly explained these three types of variables in our Grafana Crash Course.

Check if a user is an admin​

To access nested variables, use curly brackets.

{{#if (contains (variable "{__user.login}") "admin")}}
  User is an admin
{{else}}
  User is not an admin
{{/if}}

Markdown list from variable​

Create a list from the multi select variable.

{{#each (variable "hostname")}}
  - {{this}}
{{/each}}

Dynamic templates using dashboard variables​

Use the lookup helper to create dynamic templates based on dashboard variables.

The following template creates a key-value pair from every selected value in the props dashboard variable.

book:
{{#each (variable "props")}}
  {{this}}: {{lookup @root this}}
{{/each}}

JavaScript code​

Get variable value​

Use the context.grafana.replaceVariables() function to replace dashboard variables in the JavaScript Code.

const bonjour = context.grafana.replaceVariables("${variable}");
console.log(bonjour.toUpperCase());

Set variable value​

Prefix var- is required to set dashboard variable.

context.grafana.locationService.partial({ "var-variableName": ".*" });

Time range values from and to should be set as is.

context.grafana.locationService.partial({ from: start, to: end });

CSS styles​

Dashboard variables are replaced automatically in the CSS styles.