Javascript Highcharts-需要高级工具提示功能

我在使用带叠加法线的面积图进行绘图时遇到问题。我在这里问的最后一个问题是：

这基本上是询问如何在不规范化数据的情况下绘制要堆栈的值。有人告诉我，我可以从另一个序列中减去一个序列，以使图形正确显示，但是，由于这种计算，悬停时的值是倾斜的

例如： 之前：

因此，我修正了数据以绘制它：

Series Total:      [0,0,0,1,1,1,1]
Series In-Service: [0,0,0,0,0,1,2]

现在它的图形很好，但工具提示是错误的，例如，最后一个数据点应该是：

Series Total:      3
Series In-Service: 2

但它表明：

Series Total:      1
Series In-Service: 2

由于工具提示无法访问其他点，我们无法进行修复计算来显示它。除非我使用shared:true，但我不能使用shared，因为工具提示太大了，因为我有这么多系列

---

如果我不清楚，请询问任何问题，我真的需要一些帮助。

虽然可能不是最佳的，但我在类似情况下做了以下工作：

在我的配置中，我已将工具提示格式化程序设置为使用点名称

tooltip: {
  formatter: function() {
    return this.point.name;
  }
}

然后，当我添加点时，我只需使用自定义HTML设置名称，如中所示

// get x, y and other vars
series[0].addPoint({x: x, y: y, name: 'In Service: ' + inService }, false);
series[1].addPoint({x: x, y: y, name: 'Total: ' + total }, false);

---

当然，您会使用未调整的值作为总数。

虽然可能不是最佳值，但我在类似情况下做了以下操作：

在我的配置中，我已将工具提示格式化程序设置为使用点名称

tooltip: {
  formatter: function() {
    return this.point.name;
  }
}

然后，当我添加点时，我只需使用自定义HTML设置名称，如中所示

// get x, y and other vars
series[0].addPoint({x: x, y: y, name: 'In Service: ' + inService }, false);
series[1].addPoint({x: x, y: y, name: 'Total: ' + total }, false);

---

当然，您将使用未调整的值作为总数。

在设置序列数据时使用对象列表。您可以向数据点对象添加其他选项，并从工具提示格式化程序访问它

有关示例，请参见

var seriesTotal = [
    {x: 0, y: 0, customTooltip: 0},
    {x: 1, y: 0, customTooltip: 0},
    {x: 2, y: 0, customTooltip: 0},
    {x: 3, y: 1, customTooltip: 1},
    {x: 4, y: 1, customTooltip: 1},
    {x: 5, y: 1, customTooltip: 2},
    {x: 6, y: 1, customTooltip: 3}
];

var chart = new Highcharts.Chart({

    series: [
        {data: seriesTotal}
    ],

    tooltip: {
        formatter: function() {
            //access customTooltip option
            return this.point.customTooltip;
        }
    },
});

---

设置序列数据时使用对象列表。您可以向数据点对象添加其他选项，并从工具提示格式化程序访问它

有关示例，请参见

var seriesTotal = [
    {x: 0, y: 0, customTooltip: 0},
    {x: 1, y: 0, customTooltip: 0},
    {x: 2, y: 0, customTooltip: 0},
    {x: 3, y: 1, customTooltip: 1},
    {x: 4, y: 1, customTooltip: 1},
    {x: 5, y: 1, customTooltip: 2},
    {x: 6, y: 1, customTooltip: 3}
];

var chart = new Highcharts.Chart({

    series: [
        {data: seriesTotal}
    ],

    tooltip: {
        formatter: function() {
            //access customTooltip option
            return this.point.customTooltip;
        }
    },
});

---

我已经考虑过了，谢谢你的代码片段，但我有16个系列，每个系列包含100个点，计算x和y超出了我的技能水平。还有其他想法吗？我正在做类似这样的事情，绘制一个有近10000个点的散点图。它工作得出奇地好。就计算

x

和

y

而言，您不必以像素或任何形式逐字计算它们。在一个简单的情况下，您只需将

x

设置为数组的索引，并将

y

设置为数组的值。我已经考虑过这一点，感谢这些代码片段，但我有16个系列，每个系列包含100个点，计算x和y超出了我的技能水平。还有其他想法吗？我正在做类似这样的事情，绘制一个有近10000个点的散点图。它工作得出奇地好。就计算

x

和

y

而言，您不必以像素或任何形式逐字计算它们。在一个简单的情况下，只需将

x

设置为数组的索引，并将

y

设置为数组的值。