javascript - 使用 highchart 单击折线图的任意位置获取最接近的所有 Y 值

Question

我有一个包含多条趋势线的折线图。我想在单击图表中任意位置时显示所有趋势线最接近的 Y 值。

在屏幕截图中，我想在右侧面板上显示与单击图表中任意位置时的比特率相对应的所有 Y 值(即显示在工具提示中)。

我可以获取图表点击事件上的工具提示数据吗？

Answer 1

我找到了一种解决方法来查找所有趋势线的所有 y 值。但它的成本很高，因为我们必须对单个趋势线的 x 轴值进行单次迭代。

chart:{
  events: {
    click: function(e){
       console.log(getAllYValues(this, e.xAxis[0].value)) //e.xAxis[0].value is the x- coordinate where it got clicked
    }
  }
}

   function getAllYValues(chartObj, xValue) {
        var _series0 = chartObj.series[0].points;
        var key = getXValue(_series0, xValue); //Get Nearest X value
        var yValues = [];
        for (var i = 0; i < chartObj.series.length; i++) {
          yValues[i].bitsPerSecond = chartObj.series[i].points[key].y
        }
        return yValues;
    }
function getXValue(points, xValue) {
      for (var i = 0; i < points.length; i++) {
          if (points[i].x >= xValue) {
            if(i > 0) {
              return Math.abs(points[i].x - xValue) < Math.abs(points[i-1].x - xValue) ? i : i-1; //Get nearest X value

            }
            else{return i;}
          }
      }
    }