//前面的代码省略直接调用,传入echarts实例对象
connectMap(chart1,chart2);
function connectMap(chart1,chart2){
//当鼠标移入左侧的地图上
chart1.on("mouseover",function(target){
var option=chart2.getOption();
option.tooltip[0].alwaysShowContent=true;
option.tooltip[0].triggerOn="none";
chart2.setOption(option,true);
chart2.dispatchAction({
type:'downplay',
seriesName:'rightmap'
})
chart2.dispatchAction({
type:'highlight',
name:target.name,
})
})
chart1.on("mousemove",function(target){
chart2.dispatchAction({
type:'showTip',
name:target.name,
x:target.event.offsetX,
y:target.event.offsetY
})
})
chart1.on("mouseout",function(){
var option=chart2.getOption();
option.tooltip[0].alwaysShowContent=false;
option.tooltip[0].triggerOn="mousemove";
chart2.setOption(option,true);
chart2.dispatchAction({
type:'hideTip'
})
})
//当鼠标移到右边的地图
chart2.on("mouseover",function(target){
var option=chart1.getOption();
option.tooltip[0].alwaysShowContent=true;
option.tooltip[0].triggerOn="none";
chart1.setOption(option,true);
chart1.dispatchAction({
type:'downplay',
seriesName:'rightmap'
})
chart1.dispatchAction({
type:'highlight',
name:target.name,
})
})
chart2.on("mousemove",function(target){
chart1.dispatchAction({
type:'showTip',
name:target.name,
x:target.event.offsetX,
y:target.event.offsetY
})
})
chart2.on("mouseout",function(){
var option=chart1.getOption();
option.tooltip[0].alwaysShowContent=false;
option.tooltip[0].triggerOn="mousemove";
chart1.setOption(option,true);
chart1.dispatchAction({
type:'hideTip'
})
})
}