Highcharts仅在链接系列之间共享工具提示

Question

我制作的图表的置信区间界限如下：https://www.highcharts.com/demo/arearange-line

效果很好，但是当有多个数据集（因此，超过两个系列）时，共享工具提示会影响每个系列，当我只想提及系列时（不是最小值和最大值，而不是另一条线）鼠标悬停在上面，好像shared是假的。

这是我的相关配置：

tooltip: {
    shared: true,
},

series: [{
    data: averages,
    zIndex: 1,
}, {
    data: ranges,
    type: 'arearange',
    linkedTo: ':previous',
    zIndex: 0,
}, {
    data: averages2,
    zIndex: 1,
}, {
    data: ranges2,
    type: 'arearange',
    linkedTo: ':previous',
    zIndex: 0,
}]

这里有一个jsfiddle：https://jsfiddle.net/ktd39x97/

有没有人有任何想法如何解决这个问题？

Answer 1

Highcharts不支持共享工具提示的那种行为 - 所有系列只能有一种。

解决方法：

此自定义代码可以使用标准的无共享工具提示来模仿所需的行为：

  tooltip: {
    formatter: function(e) {
      var point = this.point,
        series = point.series,
        chart = series.chart,
        correspondingSeries = series.linkedSeries[0] || series.linkedParent,
        linePoint,
        arearangePoint;

      // unselect previously selected point
      if (chart.extraHoveredPoint) {
        chart.extraHoveredPoint.setState('');
      }

      // find corresponding point
      if (correspondingSeries) {
        correspondingPoint = correspondingSeries.points[point.index];
        correspondingPoint.setState('hover');
        chart.extraHoveredPoint = correspondingPoint;
      }

      // identify type of points for formatting purposes
      if (point.low !== undefined) {
        arearangePoint = point;
        linePoint = correspondingPoint;
      } else {
        arearangePoint = correspondingPoint;
        linePoint = point;
      }

      return "Line: " + linePoint.y + "<br>" + "Arearange: " + arearangePoint.low + " - " + arearangePoint.high;

    }
  },

API重新声明：

• https://api.highcharts.com/class-reference/Highcharts.Point#setState
• https://api.highcharts.com/highcharts/tooltip.formatter

现场演示： https://jsfiddle.net/BlackLabel/gq1d1aba/