因为折线图上的点太多了,不容易点击。所以我想实现一种效果,就是图上有十字线,鼠标移动到哪里,十字线就移动到哪里,因此左击鼠标,触发十字线y轴线对应的图上的点的 单击事件。
请问echarts支持上面的实现效果吗?
(echarts 只有在单击图上的点时,才会触发 单击事件。)
配置项如下
var x = [];
var y = [];
for (var i = 0; i < 300; i++) {
x[i] = '' + (i);
y[i] = Math.floor(Math.random() * 20 + 1);
}
var colors = ['#5793f3', '#d14a61', '#675bba'];
// 指定图表的配置项和数据
var option = {
color: colors,
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
}
},
xAxis: {
type: 'category',
data: []
},
yAxis: {
type: 'value'
},
series: []
};
option.xAxis.data = x;
option.series.push({
type: 'line',
symbol: 'circle',
symbolSize: 20,
showSymbol: false,
data: y
})
myChart.on('click', function (params) {
// 控制台打印数据的名称
alert(params.name);
});