如图,这个是我鼠标挪到气泡上才能显示tooltip的信息,例子http://echarts.baidu.com/demo...,我现在想在这个代码的基础上实现鼠标移到任意位置,就把当前x坐标上所有符合我条件的tooltip显示出来 例子http://echarts.baidu.com/demo...
我需要改那个代码呢?
const option = {
grid: {
top: 20,
left: '3%',
right: '60px',
bottom: '3%',
containLabel: true
},
tooltip: {
padding: 10,
formatter: (params) => {
let str = `<div class="map-tips">
<h1><i style="background:` + params.color + `" class="tag"></i>${params.value[3]}</h1>
<p><span>信息1</span><span>${params.value[0]}</span></p>
<p><span>信息2</span><span>${params.value[1]}</span></p>
<p><span>信息3</span><span>${params.value[2]}</span></p>
</div>`;
return str;
}
},
visualMap: [{
show: false,
left: 'right',
top: '10%',
dimension: 2,
calculable: true,
precision: 0.1,
textGap: 30,
textStyle: {
color: '#fff'
},
inRange: {
symbolSize: [10, 70],
color: ['#ffd800', '#ff5400']
},
outOfRange: {
symbolSize: [10, 70],
color: ['rgba(255,255,255,.2)']
},
controller: {
inRange: {
color: ['#ffd800']
},
outOfRange: {
color: ['#ff5400']
}
}
}],
legend: {
show: false,
right: 10,
data: ['1990', '2015']
},
xAxis: {
axisLine: {
lineStyle: {
color: '#e4e4e4'
}
},
axisLabel: {
textStyle: {
color: '#666'
}
},
splitLine: {
show: false,
lineStyle: {
type: 'dashed'
}
}
},
yAxis: {
axisLine: { show: false },
axisTick: { length: 0 },
axisLabel: {
textStyle: {
color: '#666'
}
},
splitLine: {
lineStyle: {
color: ['#f0f0f0']
}
},
scale: true
},
series: [{
name: '1990',
data: [],
type: 'scatter',
itemStyle: {
normal: {
shadowBlur: 2,
shadowColor: 'rgba(120, 36, 50, 0.5)',
shadowOffsetY: 1,
opacity: 0.2
}
}
}]
};