垂直方向的图表仅显示 amCharts V4 中所有数据项的单个工具提示

Question

我正在尝试让 amCharts V4 显示最靠近光标的数据项的工具提示。

问题是我的图表大部分是垂直方向的。我能够通过更新示例数据来获取垂直图表来破坏 amCharts V4 示例：https://codepen.io/fvnever/pen/jOwyQEE

在这里，当我将光标移到 Y 轴上时，数据工具提示没有改变，我希望它们得到更新。 IE。在下图中，它应该显示距离系列 1 中的光标最近的工具提示，而是显示所述系列开头的一些项目。

我尝试了文档中的各种建议：设置和不设置 chart.cursor.xAxis、chart.cursor.yAxis、chart.cursor.snapToSeries。似乎没有任何效果。

Answer 1

没有开箱即用的此类功能，但可以实现一个。两步：

确保禁用默认工具提示行为：
```
chart.cursor.snapToSeries = [];
```

现在，处理 'cursorpositionchanged' 事件并控制那里的工具提示，如下所示。

请注意这个例子效率很低（它会在每次鼠标移动时遍历所有图表节点），所以对于任何实际使用，最好将数据点存储在某种预先计算的 k-d tree.

chart.cursor.events.on('cursorpositionchanged', (e) => {
  const cursor = e.target;
  const cursorPoint = cursor.point;

  let closestSeries = null;
  let closestItem = null;
  let minimalDistance = null;
  for (const series of chart.series) {
    for (const dataItem of series.dataItems) {
      const dataPoint = dataItem.point;
      const distance = Math.sqrt(Math.pow(cursorPoint.x - dataPoint.x, 2) + Math.pow(cursorPoint.y - dataPoint.y, 2));
      if (minimalDistance === null || distance < minimalDistance) {
        minimalDistance = distance;
        closestItem = dataItem;
        closestSeries = series;
      }
    }
  }

  for (const series of chart.series)
    series.tooltip.disabled = series !== closestSeries;

  if (closestItem)
    closestSeries.showTooltipAtDataItem(closestItem);
});

完整的测试示例：https://codepen.io/fvnever/pen/yLXbEKG

垂直方向的图表仅显示 amCharts V4 中所有数据项的单个工具提示

Vertically-oriented chart only shows single tooltip for all data items in amCharts V4

javascript

amcharts4