【弄nèng - Grafana】入门篇(十二)—— Diagram panel绘制流程图

Diagram图表详解
Diagram 需要安装额外的插件才能使用,地址传送门

在这里插入图片描述

简介

Diagram是一个Grafana面板插件,它提供了一种利用mermaid.js库创建流程图,序列图和甘特图的方法。

  • 可以使用Mermaid JS语法定义图。
  • 公制系列用于为形状/节点的背景着色。
  • 将系列的目标或“别名”与图表节点的ID进行比较以找到匹配项,然后对形状应用“填充”样式。
  • 复合可以用于聚合单个节点的多个系列,每个系列具有自定义阈值。

注意-别名中的特殊字符将替换为下划线

安装
参看官网:cli安装或者zip安装

grafana-cli plugins install jdbranham-diagram-panel

1. General

页面属性同graph一样,Graph教程传送门

2. Metrics

页面属性同graph一样,Graph教程传送门

在这里插入图片描述

3. Diagram

在这里插入图片描述
使用Mermaid JS语法定义图,Mermaid JS很简单,学习请看https://blog.csdn.net/fenghuizhidao/article/details/79440583
https://blog.csdn.net/Cribug8080/article/details/88595314

有两种方式定义:

  1. http:调用http接口返回Mermaid JS字符串,注意响应类型要是text/plain
  2. content: 自定义
    例如图中A 对应的是Metrics查询的别名,这样值就会显示到节点上

4. Display

在这里插入图片描述
在这里插入图片描述

5. Metric Composites

在这里插入图片描述
可以将多个指标进行组合成新的指标,显示值较小的或者较大的那个。(个人实践所得,官网看不懂)
例如将指标A和B组合成指标XYZ

6. Value Mappings

在这里插入图片描述

7. Time range

页面属性同graph一样,Graph教程传送门

8. 事例

使用的是ES数据源

Metrics
在这里插入图片描述

Diagram
在这里插入图片描述
Display
在这里插入图片描述
Value Mappings
在这里插入图片描述
效果
在这里插入图片描述


项目推荐

IT-CLOUD :IT服务管理平台,集成基础服务,中间件服务,监控告警服务等。
IT-CLOUD-ACTIVITI6 :Activiti教程源码。博文在本CSDN Activiti系列中。
IT-CLOUD-ELASTICSEARCH :elasticsearch教程源码。博文在本CSDN elasticsearch系列中。
IT-CLOUD-KAFKA :spring整合kafka教程源码。博文在本CSDN kafka系列中。
IT-CLOUD-KAFKA-CLIENT :kafka client教程源码。博文在本CSDN kafka系列中。
IT-CLOUD-ZOOKEEPER :zookeeper客户端Curator事例。博文在本CSDN zookeeper系列中。

开源项目,持续更新中,喜欢请 Star~

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值