解决vue中使用echarts,大量数据缩放卡顿的问题

问题

在echarts官网的demo中,k线图的缩放是很流畅的,但是在项目中实现之后,缩放时分的卡,有时间根本缩放不动

最开始想的是可能是数据量太大了,然后将api返回的数据进行了打印,发现数据不到300条,所以和数据量没有关系。

将官网demo重新在项目中实现,发现也没有卡顿的现象。

将代码进行对比,发现没有什么不同

唯一不同的就是我在初始化echarts之后,使用了一个变量接收了一下

 var myChart = echarts.init(this.$refs.echartContainer);
 this.Chart = myChart;

把变量的接收去掉。

问题没有了,
但是其他地方还需要对这个echarts实例项进行操作,比如setOption,与clean,所以还是需要一个中间变量接收一下。

在script中定义一个变量用来接收,而不是在vue的data中

var charts="";
export default {
}

完美解决echarts在vue中的卡顿问题,到现在都还没有明白出现这个问题的原因。希望有知道原理的大神告知一下。

上一篇:c# DateTime 与UNIX时间戳转换


下一篇:vue 请求后台数据