Highcharts鼠标跟踪行为具有多个区域范围＆amp;系列

Question

我创建了一个图表，该图表使用arearange系列作为对line系列的一种甘特图叠加。

JSFiddle

问题是当鼠标悬停在arearange系列上时，当您从左向右移动光标时，工具提示会跳转到另一个系列。下图显示了此效果（红点表示鼠标位置）：

我已尝试按照API：

中的说明设置以下选项

plotOptions.series.stickyTracking: false
tooltip.shared: false

我甚至尝试过：tooltip.snap: 0

但跳跃效果仍然存在。我的目的是插入mouseOver和mouseOut事件，以便我可以在图表下方显示一些其他详细信息 - 但这对于当前行为是不可行的。

是否可以拥有mouseOver＆amp;仅当光标直接在系列上移动时才会触发mouseOut个事件？这是我的配置还是当前highcharts版本的限制？

Answer 1

从Highcharts GitHub页面中提出this建议，我已经在我的区域范围内插入了一些额外的点，以便工具提示可以找到最近的点（与我期望的线相对）。

有关示例，请参阅此JSFiddle。

arearange插值函数：

function interpolateAreaRange(data, splitBy) {
  var interpolate = function(x1, x2, x3, y1, y2) {
    return y1 + (y2 - y1) * (x2 - x1) / (x3 - x1);
  };
  var newData = [],
    step = 0,
    xStart = 0,
    xEnd = 0,
    xNew = 0,
    p = 0;
  if (data.length > 1 && splitBy > 0) {
    newData.push(data[0]);
    for (var i = 1; i < data.length; i++) {
      p = i - 1;
      xStart = data[p][0];
      xEnd = data[i][0];
      step = (xEnd - xStart) / splitBy;

      for (var s = 1; s <= splitBy; s++) {
        xNew = xStart + (step * s);
        newData.push([
          xNew,
          interpolate(xStart, xNew, xEnd, data[p][1], data[i][1]),
          interpolate(xStart, xNew, xEnd, data[p][2], data[i][2])
        ]);
      }
      newData.push(data[i]);
    }
    return newData;
  }
  return data;
}