Highcharts 仅在彩色区域检测 mouseOver 事件

Question

我有一个“区域”类型系列，我需要检测用户何时将鼠标悬停在彩色区域中仅上，以便在那里呈现标签。

我可以看到有可能在彩色区域捕捉到“点击”事件，但在该彩色区域无法捕捉到“mouseOver”only，因为该事件也被触发当您位于区域上方时（当 trackByArea=true 时）

这是一个描述问题的示例：

Highcharts.chart('container', {
  chart: {
    type: 'area'
  },
  title: {
    text: 'US and USSR nuclear stockpiles'
  },
  series: [{
    name: 'USA',
    data: [6, 11, 32, 110, 235, 369, 640,
      1005, 1436, 2063, 3057, 4618, 6444
    ],

    trackByArea: true,
    cursor: 'pointer',

    events: {
      //Click event is triggered only inside the area
      click: function(event) {
        alert('Trigger Drilldown')
      },
      //mouseOver event is triggered inside and above the area
      mouseOver: function(event) {
        console.log('TriggermouseOver')
      }
    }
  }]
});

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

作为旁注，我意识到这应该是可能的，因为光标在该区域内时正在更新。谢谢！

Answer 1

在绘图选项中添加stickyTracking: false,

plotOptions: {
 series: {
  stickyTracking: false,
 }
},

Highcharts.chart('container', {
  chart: {
    type: 'area'
  },
  title: {
    text: 'US and USSR nuclear stockpiles'
  },
  plotOptions: {
    series: {
      stickyTracking: false,
    }
  },
  series: [{
    name: 'USA',
    data: [6, 11, 32, 110, 235, 369, 640,
      1005, 1436, 2063, 3057, 4618, 6444
    ],

    trackByArea: true,
    cursor: 'pointer',

    events: {
      //Click event is triggered only inside the area
      click: function(event) {
        alert('Trigger Drilldown')
      },
      //mouseOver event is triggered inside and above the area
      mouseOver: function(event) {
        console.log('TriggermouseOver')
      }
    }
  }]
});

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>