Skip to main content

Variables

The Dynamic 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

Use the replaceVariables function to replace dashboard variables in the JavaScript Code.

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

CSS styles

Dashboard variables are replaced automatically in the CSS styles.