echarts地图利用2.0版本时tooltip出现闪动情况的解决办法

先前做统计图展示页面的时候,由于是每5秒请求数据返回给地图,所以,在鼠标hover到地图的时候,由于数据的渲染,会出现闪动的情况,因为每次收到数据就去setOption一次。

最后的处理方法是,在setOption之前先加个标志位,如果鼠标移到地图map上,就不去setOption,涉及到echarts的on事件,

var myChart = echarts.init(document.getElementById("map"));
myChart.on('hover',setFlagTrue);
myChart.on('mouseout', setFlagFalse)

但是这样设置之后,就是如果鼠标一直在地图上,那么数据及时更新了,也没法展示正确的信息,需要鼠标先移到图形外部一下,再隔5s的渲染之后,再移上去才会展示正确的信息。

另外,放置地图的时候,tooltip提示框是从右侧往鼠标位置移动过来(最终仍显示在鼠标右侧,其实我还没有找到echarts2中设置从哪边过来的配置项,有知道的大神求教),但是右侧位置由于画布太小,它又会自适应的把提示框往左边推移直到完全显示,这时候容易出现你鼠标移动,他每次都在调整位置的闪动情况,感觉像是卡在了某个地方一下,视觉体验并不好。

然而,又没有找到如何关闭从右侧过来的动效,所以干脆直接把画布弄大,然后设置图形与画布两边的间隙,让右侧空间足够放置提示框,就不会出现自适应到左边的情况。

但是一开始是

你可能感兴趣的:(前端,echarts)