Highcharts - 鼠标悬停在列上的事件

Question

我们正在尝试访问用户悬停的列的值。

最初我们使用 Window.event 来捕获点，但是在升级 Angular 和 Node 版本后，window.event 没有按预期响应（因为它已被弃用）。请让我知道阅读悬停栏的任何替代方法。

技术栈： Angular 16（从版本8升级） 节点 16.16

请帮忙。

我们需要读取柱形图悬停柱的值。

plotOptions: {
series: {
    events: {
        mouseOver: ($events) => {
            // I would like to capture data on which mouse is hovering
            console.log($events);
        }
    }
}

}

Answer 1

首先，你需要使用：

• plotOptions.series.point.events.mouseOver

而不是：

• plotOptions.series.events.mouseOver

要获取悬停点，请使用：

event.target

plotOptions: {
  series: {
    point: {
      events: {
        mouseOver: (event) => {
          console.log(event.target);
        }
      }
    }
  }
}

或基本功能中的

this

：

mouseOver: function (this: Highcharts.Point) {
  console.log(this);
}

---

现场演示：https://stackblitz.com/edit/highcharts-angular-line-zha7hq?file=src%2Fapp%2Fapp.component.ts

API 参考： https://api.highcharts.com/highcharts/plotOptions.column.point.events.mouseOver