Variables
Dynamic Text Panel provides helpers to support variables. You can also use variables in the JavaScript code and CSS styles.
We thoroughly explained these three types of variables in our Grafana Crash Course.
Helper {{variable}}
Returns a string array including the currently selected values for a certain variable.
Check if a user is an admin
To access nested variables, use curly brackets.
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.