echarts数据项过多导致当前项目的用户操作卡顿的解决

在打了近两周的酱油后在昨天终于想出了卡顿优化的解决方案,想看看有多卡可以参见这篇博客,就此项目中前端的技术难点几乎全部攻克。

解决方式:

原理很简单,在原来的dom节点上再定位一层echarts实例用于画线,画线的实现参见这篇博客,由于画线和原图表是两个echarts实例,所以两者不会有丝毫的影响。因此交互性大大提高。

《echarts数据项过多导致当前项目的用户操作卡顿的解决》

存在的问题:

由于覆盖了一层canvas画布,导致底层echarts的鼠标事件不能被触发,例如tootip、legend、按钮等等将无法触发。

可能的解决方案:

设置一个开始绘线的按钮和清理已绘线条的按钮,分别调用echarts.init()echartsInstance.dispose();

点赞

发表评论

电子邮件地址不会被公开。 必填项已用*标注