用 DataV 展示 Prometheus 数据

简介: 本文介绍了如何将 Prometheus 数据接入 DataV 进行可视化展示。如果使用的是阿里云可观测监控中的 Prometheus 实例,或者自建的 Prometheus 开放了公网可访问的 HTTP API,那么可直接通过 API 将数据接入 DataV 展示。

Prometheus 是业界广泛使用的云原生监控系统。如需将 Prometheus 采集的数据通过 DataV 进行可视化展示,可以参考如下方式。


使用阿里云的 Prometheus

如果使用的是阿里云可观测监控中的 Prometheus 实例,或者自建的 Prometheus 开放了公网可访问的 HTTP API,那么可直接通过 API 将数据接入 DataV 展示。

这里我们要使用公网地址,如果担心数据安全问题可以开启 token 验证。

image.png


HTTP API 的具体使用方法可以参考 Prometheus 官方文档:

https://prometheus.io/docs/prometheus/latest/querying/api/



在 DataV 中添加 API 类型的数据源。

  1. 如果 Prometheus HTTP API 开启了 token 检查,则需要在 Headers 一栏中配置:
{
  "Authorization": "<你的 token>"
}
  1. 如果不希望 Prometheus HTTP API 的地址泄漏,可以勾选上「服务器代理请求」。

image.png


如果有需要还可以配置「过滤器」对 API 返回的结果数据格式进行处理。至此可以在 DataV 大屏上展示 Prometheus 的数据了。



使用自建 Prometheus

如果是自建的 Prometheus 或者无法使用上述的 HTTP API,那么可以将 Prometheus 的数据先导入阿里云 SLS 服务,然后再通过 DataV 进行展示。


SLS 接入 Prometheus 数据参考文档:

https://help.aliyun.com/zh/sls/user-guide/collect-metric-data-from-prometheus

DataV 展示 SLS 数据文档:

https://help.aliyun.com/zh/datav/datav-7-0/user-guide/add-a-simple-log-service-data-source


这种方式的额外优势是可以借助阿里云 SLS 的分析能力,对数据进行预加工。




相关实践学习
基于Hologres轻松玩转一站式实时仓库
本场景介绍如何利用阿里云MaxCompute、实时计算Flink和交互式分析服务Hologres开发离线、实时数据融合分析的数据大屏应用。
阿里云实时数仓实战 - 项目介绍及架构设计
课程简介 1)学习搭建一个数据仓库的过程,理解数据在整个数仓架构的从采集、存储、计算、输出、展示的整个业务流程。 2)整个数仓体系完全搭建在阿里云架构上,理解并学会运用各个服务组件,了解各个组件之间如何配合联动。 3&nbsp;)前置知识要求 &nbsp; 课程大纲 第一章&nbsp;了解数据仓库概念 初步了解数据仓库是干什么的 第二章&nbsp;按照企业开发的标准去搭建一个数据仓库 数据仓库的需求是什么 架构 怎么选型怎么购买服务器 第三章&nbsp;数据生成模块 用户形成数据的一个准备 按照企业的标准,准备了十一张用户行为表 方便使用 第四章&nbsp;采集模块的搭建 购买阿里云服务器 安装 JDK 安装 Flume 第五章&nbsp;用户行为数据仓库 严格按照企业的标准开发 第六章&nbsp;搭建业务数仓理论基础和对表的分类同步 第七章&nbsp;业务数仓的搭建&nbsp; 业务行为数仓效果图&nbsp;&nbsp;
目录
相关文章
|
15天前
|
JSON 数据可视化 定位技术
python_将包含汉字的字典数据写入json(将datav的全省数据中的贵州区域数据取出来)
python_将包含汉字的字典数据写入json(将datav的全省数据中的贵州区域数据取出来)
19 0
|
4月前
|
数据可视化 JavaScript 开发工具
vue2+datav可视化数据大屏(3)
接上一节所说,当我们将接口封装完了后,我们需要给大屏进行内容填充啦
121 0
|
4月前
|
数据可视化 JavaScript API
vue2+datav可视化数据大屏(2)
接上一节所说 我们已经讲骨架搭好 这节我们讲述的如何在vue2中使用mock数据和封装axios
|
4月前
|
数据可视化 JavaScript 前端开发
vue2+datav可视化数据大屏(1)
最近打算出一个前端可视化数据大屏的系列专栏,这次将很全面的教大家设计可视化大屏,从开始到打包结束,其中,包括如何设计框架,如何封装axios,等等,本次使用的数据均为mock数据。与正常使用一致。本文会从开始的创建vu23项目到最后的项目打包,本篇共计3节。
291 1
|
4月前
|
数据可视化 前端开发 JavaScript
react+datav+echarts实现可视化数据大屏
最近有点闲,就学习了下react,没想到就把react学完了,觉得还不错,就打算出一把react+datav的简易版可视化数据大屏供大家做个参考
173 2
react+datav+echarts实现可视化数据大屏
|
9月前
|
数据可视化 容器
DataV构建大屏(全屏)数据展示页面
DataV构建大屏(全屏)数据展示页面
551 0
|
12月前
|
资源调度 数据可视化 JavaScript
vue3+DataV+Echarts搭建数据大屏模板(建议收藏)
vue3+DataV+Echarts搭建数据大屏模板(建议收藏)
817 0
vue3+DataV+Echarts搭建数据大屏模板(建议收藏)
|
存储 监控 数据可视化
物联网数据 DataV 演示|学习笔记
快速学习物联网数据 DataV 演示
332 0
物联网数据 DataV 演示|学习笔记
|
数据可视化 定位技术 Python
使用python下载地图边界坐标(省市县级)数据来自阿里datav
使用python下载地图边界坐标(省市县级)
354 0
|
SQL 数据可视化 JavaScript
DataV图表的数据筛选交互需求梳理及实现样例
本文主要对DataV大屏数据表、气泡地图等组件的筛选交互需求进行一个简单的梳理及样例实现,其中包括单字段单选筛选、单字段多选筛选、多字段共同筛选、字段级联及查询按钮的配置。
1685 3
http://www.vxiaotou.com