2019-10-12 刷新echarts图形数据的方式

2019-10-12  本文已影响0人  qiaoguoxing

第一种方式:像这样完全重绘一下echarts图形

drawZjymqkChart () {

      let myChart = document.querySelector('#js-zjymqk-chart')

      // let chart = this.$echarts.init(myChart)

      // chart.setOption(chartFun.setTriangleChart(this.chartsData.zjymqk))

    },

这样做有可能会存在问题,这相当于每次都重新绘制了一遍图形,还有就是不知道是什么原因导致一些图形不刷新(比如最近项目遇到的象形图)

第二种方式:通过数据更新的方式

首先把所画的图定义成一个全局的对象  例如:myChart: null,

然后通过watch图形绑定数据的变化,执行数据刷新的函数: this.updateData(),在这里我们只改变了yDate和sdata的值。

updateData () {

      let option = this.myChart.getOption()

      var sdata = this.chartsData.zjymqk.seriesData

      var yData = []

      for (var key in sdata) {

         yData.push(sdata[key])

      }

      option.series[0].data = yData

      option.series[1].data = yData

      this.myChart.setOption(option)

    },

上一篇下一篇

猜你喜欢

热点阅读