鼠标点击十字线,触发十字线对应图上的选中的点的单击事件echarts 折线配置项内容和展示

因为折线图上的点太多了,不容易点击。所以我想实现一种效果,就是图上有十字线,鼠标移动到哪里,十字线就移动到哪里,因此左击鼠标,触发十字线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);
		});
    
截图如下