Echarts: how to catch the internal emphasis event

63 Views Asked by At

I am using ECharts to plot a multi-line graph.

To catch the emphasis event (line-series), I use mouseover. But it works unstably: when the built-in emphasis is activated, I often do not receive the mouseover event. How can I catch the event for the internal emphasis?

upd: I've noticed that the internal emphasis occurs if you hover the mouse over the lines connecting the data-points or the data-points themselves. At the same time, mouseover only triggers if you hover over the data-points. In this case, the question is - how to make the mouseover event happen when hovering over the connecting lines as well.

    myChart.on('mouseover', {seriesIndex: 0}, function () {
           console.log('hover');
    });

Options:

    option = {  xAxis: ...,
      series: [{
        data: ...,
        type: "line",
        emphasis: {
          lineStyle: {
            width: 7.5
          }
        }
      }]
    }
1

There are 1 best solutions below

0
VovaM On

The precise answer to this question is as follows: to have the mouseover event for line-series occur just as the internal emphasis does, you need to explicitly specify that ECharts triggers the mouseover event, not only for data points but also for the lines. To do this, you need to set triggerLineEvent:

option = {  xAxis: ...,
      series: [{
        data: ...,
        type: "line",
         triggerLineEvent: true
        }
      }]
    }