这期内容当中小编将会给大家带来有关Vue中使用Echarts实现仪表盘展示实时数据,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。
在vue中echarts仪表盘实时数据
彩笔一枚,简单记录一下。
业务场景:通过websocket实时推送数据,将数据渲染到仪表盘中。
第一步:
基于准备好的dom,初始化echarts仪表盘实例。
第二步:
我是通过父子组件传值把数据接收过来,在data中定义upPressure参数,并将接收来的devicePressure参数赋值给它,便于后面将值传入到echarts中
父组件中子组件中 export default { props: { devicePressure: { type: String, require: true }, }, data() { return { upPressure: this.devicePressure, }; },