highcharts-react Gantt：从鼠标悬停获取鼠标坐标

【问题标题】：highcharts-react Gantt: get mouse coordinates from mouse-overhighcharts-react Gantt：从鼠标悬停获取鼠标坐标
【发布时间】：2019-01-03 14:58:23
【问题描述】：

我正在使用官方的 highcharts 包装器进行反应以生成甘特图。我正在尝试从鼠标悬停事件中获取鼠标坐标并将它们用于自定义工具提示，但坐标不精确。

示例： https://stackblitz.com/edit/react-c5mivs

该事件返回 plotX 和 plotY 据我所知应该是鼠标坐标。它还返回一个名为 tooltipPos 的数组，我猜它是本机工具提示的坐标。

两者都将工具提示放置在错误的位置。有没有我遗漏的偏移量？

【问题讨论】：

标签： javascript reactjs highcharts

【解决方案1】：

坐标plotX 和plotY 与绘图区域相关。如果要与图表容器建立关系，则需要添加plotLeft 和plotTop 值：

handleTooltip = (event) => {
  const chart = event.target.series.chart;

  this.setState({
    isVisible: true,
    tooltipPosX: chart.plotLeft + event.target.tooltipPos[0],
    tooltipPosY: chart.plotTop + event.target.tooltipPos[1]
  })
};

现场演示：https://stackblitz.com/edit/react-jfehmb?file=index.js

【讨论】：