h5页面含有多个echarts，其中每个都有tooptips，点击其他区域tooptip不消失，体验不好
解决方法一：
以vue脚手架处理为例：
处理思路：点击页面空白处，判断当前点击区域是否是canvas，如果不是就将所有的echarts中的tooptips隐藏
1、在main.js中添加js
vue.prototype.pageClick = function(id,callback){
document.getElementById(id).onclick = function(e){
if(e.target.nodeName != ‘CANVAS‘){
callback()
}
}
}
2、在使用echarts的页面
mounted(){
this.pageClick(‘整个页面最外层的id‘，this.removeTooptips)
},
methods:{
removeTooptip(){
var arr = document.getElementsByTagName(‘canvas‘);
for(var i=0;i<arr.length;i++){
//这里的id是echarts生成实例上的id，getInstanceByDom方法是找到id下的echarts实例
let id = arr[i].parentNode.parentNode.getAttribute("id");
var ee = echarts.getInstanceByDom(document.getElementById(id));
ee.dispatchAction({
type:‘hideTip‘
})
ee.dispatchAction({
type:‘updateAxisPointer‘,
})
}
}
}
解决方法二：
在echarts的setOption里面的tooptips里面有个属性是show:true,也可以将这里的true改成一个变量，在代码中根据需求修改这个变量值也可以
h5页面含有多个echarts，其中每个都有tooptips，点击其他区域tooptip不消失，体验不好
原文：https://www.cnblogs.com/deng-jie/p/14963498.html