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

Question

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

我看到有可能在彩色区域捕捉到"click"事件，但是在"mouseOver" 只有中捕捉不到该彩色区域，因为当您位于该区域上方时也会触发该事件（当 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>

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

Highcharts Detect mouseOver event only in the colored area

javascript

events

highcharts

mouseover