Echarts：鼠标悬浮防止溢出

一、创建方法

onChartMouseMove(params) {
  var points = myChart.getModel().getSeriesByIndex(0).getData()._itemLayouts;
  var mousePoint = [params.event.event.clientX, params.event.event.clientY];
  var activePoint;
  var minDistance = Infinity;

  // 计算鼠标与所有data point的距离
  points.forEach((point, index) => {
    var distance = Math.sqrt(Math.pow(point[0] - mousePoint[0], 2) + Math.pow(point[1] - mousePoint[1], 2));
    if (distance < minDistance) {
      minDistance = distance;
      activePoint = index;
    }
  });

  // 如果鼠标在某个data point附近（例如30像素以内），则显示tooltip
  if (minDistance < 30) {
    myChart.dispatchAction({
      type: 'showTip',
      seriesIndex: 0,
      dataIndex: activePoint
    });
  }
}

二、使用

myChart.on('mousemove', this.onChartMouseMove);