开发插件时遇到图表闪烁的问题

[YTed]

One-line summary [问题简述]

我为 ECharts 开发了一个嵌入到天地图的扩展，原理是在天地图中加入一个新的图层，作为 ECharts 的容器，目前的问题是，地图上加载了统计图表以后，移动地图时图表会出现闪烁。初步分析，图表闪烁的原因如下：

1. 图层 DIV 大小固定；
2. 图层 DIV 是相对于地图上某个 DIV 进行布局的，移动地图的时候，该 DIV 随地图整体一起移动，此时不会出现闪烁的情况；
3. 地图移动完毕以后，我控制该 DIV 偏移回原来的的屏幕位置，同时刷新 ECharts，此时：
   1. DIV 移动回原来的屏幕位置，上面的 canvas 并没有刷新，图表在地图上反向偏移；
   2. ECharts 刷新，图表恢复到正常位置；
   3. 上面两个事件依次发生，整体表现为地图上的图表闪烁。

我尝试了地图移动时屏蔽容器 DIV（elem.style.display='none'）移动结束则更新并显示该 DIV，然而，估计因为异步刷新的原因，此问题仍然存在。

此插件的开发参考了 echarts.bmap，由于天地图与百度地图的机制不一样，不能采取与百度地图同样的逻辑。

Version & Environment [版本及环境]

• ECharts version [ECharts 版本]: 3.8.5
• Browser version [浏览器类型和版本]: Chrome 62.0.3202.94 (64位)
• OS Version [操作系统类型和版本]: Windows 10 (1709)

Expected behaviour [期望结果]

期望 ECharts 可以提供某种方法，使得图表不会闪烁：

1. 清除-回调：是否存在某种方法，可以在地图移动结束以后，清除 DIV 上的图表，然后等待图表渲染完成后再次显示（比如移动结束后隐藏 DIV，渲染完成调用回调函数，显示 DIV）。

ECharts option [ECharts配置项]

option = {

}

Other comments [其他信息]

示例 Github： https://github.com/YTed/tianditu-echarts-plugin

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.