dd-rc-mStock
v0.0.12
Published
---
Downloads
6
Readme
dd-rc-mStock
监控图表组件可以通过节点空间和监控名称获取监控数据,也可以直接传入监控数据,二者必须选一
安装
示例
import MStock from 'dd-rc-mStock';
<MStock ns="xxx.xxx.xxx" mName="cpu.idle" mode={1} />
Props
| 参数 | 说明 | 类型 | 默认值 |
| ---- | ---- | ---- | ------ |
| ns | 节点空间 | string | |
| mName | 监控名称 | string | |
| mode | 1: 大图模式;2: 小图模式,收缩工具条到图标中,关闭图表导航等 | number | 1 |
| mData | 监控数据 监控图表的配置依赖mData数据,以及series接口需要mData | object | |
| callbacks | 回调 | object | |
| hConfig | 图表配置 可以对曲线图做一些个性化配置Highstock Api | object | |
mData
{
'ns': 节点空间 {String} 例如 "collect.api.xxx.com"
'mName': 监控名称 {String} 例如 "cpu.idle"
'aggregate': 聚合计算 {String} "avg"、"sum"、"max"、"min"
'dataGrouping': 采样算法 {String} "avg"、"max"、"min"
'interval': 采集周期 {Number} (秒)
'measurement_type': 采集类型 {String} 例如 "CPU"、"LOG"...
'unit': Y轴单位 {String} 例如 "%"...
'yaxis': Y轴范围值{Array} 例如 "[-10, 0, 10]", 服务储传来的是数组字符串,后面需要转换成数组
'stime': 开始时间 {String} 毫秒时间戳
'etime': 结束时间 {String} 毫秒时间戳
'selectedTags': 已选择Tags {Object} 例如 selectedTags: { status: ['404', '200'] }
}
callbacks
- beforeInitChart(config) 曲线图初始化前回调,可以在初始化前再次对配置做修复,返回新的配置
- initChart(chart) 曲线图初始化回调,需要自己加载以及处理 seriesData,非必要场景不建议使用,会覆盖内置的方法
- afterInitChart(chart, seriesData) 曲线图初始化后回调, 可以在渲染完曲线图后做一些后置操作
Methods
- getChart 返回highstock实例
- setChart 更新highstock实例
- stockUpdate 更新图表
- getMData 获取图表数据
- setMData 更新图表数据