Variables

Use replaceVariables() function to replace Dashboard and Global variables.

const email = replaceVariables("${__user.email}");

Dashboard, Global and Environment variables.

Global Variables

You can find global built-in variables in the Grafana documentation.

Replace Dashboard Variables

In the following example, we replaced series's name with the variable's value.

Replace Dashboard Variables.

Visualization panel's function:

let names = [];
let amounts = [];
data.series.map((s) => {
  names = s.fields.find((f) => f.name === "Name").values.buffer;
  amounts = s.fields.find((f) => f.name === "Amount").values.buffer;
});

return {
  grid: {
    bottom: "3%",
    containLabel: true,
    left: "3%",
    right: "4%",
    top: "4%",
  },
  tooltip: {},
  legend: {},
  xAxis: {
    data: names,
  },
  yAxis: {},
  toolbox: { feature: { restore: {} } },
  series: [
    {
      name: replaceVariables("$var"),
      type: "bar",
      data: amounts,
    },
  ],
};

Update Dashboard Variables

Dashboard variables can be updated in the Event Handlers.

echartsInstance.on("click", (params) => {
  locationService.partial({ "var-name": value }, true);
});