The provided code gathers store information from the `series` property...
The provided code gathers store information from the series
property of context.panel.data
in a Grafana plugin or panel. Then, it populates a JavaScript Set
(called storeSet
) with unique stores by extracting the "metric.label.store"
property from the meta.custom.labels
object of each seriesObj
. The Set
ensures that only unique store names are stored. This process is logged to the console at two points: once for each store name as it is added and once for the final Set
containing all unique stores.
To update the Grafana dashboard variable (Store
) dynamically from JavaScript using Grafana's locationService
, you can leverage the setVars
or similar functionality available through this service in Grafana. You can use the following extended code to populate the dashboard variable Store
:
// Initialize a Set to store unique store names
const storeSet = new Set();
// Extract store information from the data series
context.panel.data.series.forEach((seriesObj) => {
if (seriesObj.meta.custom.labels["metric.label.store"]) {
storeSet.add(seriesObj.meta.custom.labels["metric.label.store"]);
console.log(seriesObj.meta.custom.labels["metric.label.store"]);
}
});
// Log the unique stores
console.log(storeSet);
// Convert the Set to an Array as Grafana dashboard variables often work with arrays
const storeArray = Array.from(storeSet);
// Access Grafana's locationService to update the dashboard variable
const locationService = getLocationSrv();
locationService.update({
vars: {
Store: storeArray.join(','), // Update the "Store" variable with the list of stores as a comma-separated string
},
});
Key Details:
-
Extracting Unique Stores:
- The
forEach
loop iterates over theseries
incontext.panel.data
. It extracts the"metric.label.store"
value frommeta.custom.labels
for eachseriesObj
and adds it to thestoreSet
.
- The
-
Grafana's Location Service:
- Grafana provides the
getLocationSrv()
function to access thelocationService
. This service allows programmatic updates to the query string, dashboard variables, and other URL parameters.
- Grafana provides the
-
Updating the Dashboard Variable:
- The
locationService.update
method is used to modify the value of a dashboard variable. Grafana dashboard variables are expected to be in a format like a string or array, depending on their configuration. In this case, thestoreArray
is converted to a comma-separated string to match typical variable input formats.
- The
-
Assumptions:
- It assumes you're working in a Grafana React-based panel plugin or environment where
getLocationSrv()
is readily accessible.
- It assumes you're working in a Grafana React-based panel plugin or environment where
For Successful Execution:
- Ensure that the
Store
variable exists in Grafana and is of the correct type (e.g., query-based or custom). - Make sure that the
getLocationSrv
function is correctly imported:import { getLocationSrv } from '@grafana/runtime';
- The variable type you're updating must align with the expected format in Grafana. For example, a custom variable may require a comma-separated string of values, whereas other variable types could work differently.
This code performs the data extraction and updates the Grafana variable as requested.