Echarts图表在VUE项目中使用动态数据源
动态数据源问题:目前我使用的方法是当后台查询到数据时,直接传递给option中的对应data内;
例如柱状图,可以直接将x轴数据注入到 this.option.xAxis.data 中,如
this.option.xAxis.data.push(res.result[i].属性)
其中括号内为获取的要注入的值,该条语句直接放置在循环中,将结果中的数据全部注入。
y轴数据也可以采用相应的方式注入到 this.option.series.data 中,当y轴数据有多个时,可以采用如下方法:
this.option.series[0].data.push(res.result[i].属性1) this.option.series[1].data.push(res,result[i].属性2)
其他图形种类思路类似。
以上。
目前采用的是这种方法而未采用 setOption 方法的形式,利用VUE对于数据刷新方面的特性。功能已经成功实现。如果有什么不足或者错误之处,还请见谅并指出。