Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard

文章目录

    • 1. 创建两个空白 Dashboard 用于实验
    • 2. dash_1:创建跳转用的表格
    • 2. dash_2:配置接收数据的变量 Variables
    • 3. 测试跳转
    • 4. 通过跳转的变量传递方法总结

这里,我们一步步的来,通过配置一个页面跳转的效果,把一个变量从一个dashboard传递到另一个dashboard

1. 创建两个空白 Dashboard 用于实验

先创建两个空白的dashboard,用途如下:

  1. dash_1:主控制,发送一个自定义值的变量

  2. dash_2:接收并展示传递出来的变量

    Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第1张图片

2. dash_1:创建跳转用的表格

  1. 在dash_1中,点击右上角的Add panel,添加一个图标,按照如下方法配置数据源:
    Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第2张图片

  2. 在表格配置右侧点击【Add field override】,在新建的配置中按照如下配置,将name这一列变成可以跳转的链接

    Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第3张图片
  3. 点击【Add link】,为name这一列添加超链接,输入URL为:
    http://127.0.0.1:3000/注意导航栏,这里用大家自己的URL/dash_2?var-query0=${__data.fields.name}
    Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第4张图片

  4. 保存dash_1的全部结果,已经结束了

2. dash_2:配置接收数据的变量 Variables

  1. dash_2中,点击右上角的小齿轮打开配置

  2. 点击左侧的Variables,添加一个变量

    Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第5张图片
  3. 按照如下方式,配置一个自定义的数据,然后点击Update

    Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第6张图片
  4. 保存并回到dashboard,可以看到变量配置完成

    Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第7张图片

3. 测试跳转

返回dash_1,点击表格中的任意链接:
Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第8张图片
都会弹出dash_2表格,并且呈现点击的那个文本文字

Grafana链接跳转与值传递,把表格变量值从一个dashboard传递给另一个dashboard_第9张图片

4. 通过跳转的变量传递方法总结

我们回顾一下上面的做法,其实步骤就是:

  1. 用表格数据配置一个跳转连接
  2. 在dash_1的跳转连接中,用${__data.fields.name}获取表格值,并用xxx/dash_2?var-query0=${__data.fields.name}发送URL
  3. 在dash_2中,直接用变量接收,如果是其他地方想要接收,可以使用$var-query0,可以直接拿到这个变量的值

你可能感兴趣的:(grafana)