Highstock：如何使第一列的系列名称在工具提示上动态显示，年份明智

Question

我必须在一个图表中显示两个条形图，其中第一个系列（条形图）是 2015 年的，第二个是 2016 年的。但是当图表包含两年的数据时。然后我应该需要工具提示 {series.name} 来选择 {point.key} 并从中提取年份让我们说，2016 年，然后在运行时间将 series.name 更改为 2016 年第一根柱和第二根柱到在工具提示上 {2016 - 1} = 2015。因此，如果条的数据是 3-4 年的，为了第一个系列，现在它只需要我添加的 series.name，但是如何让它在第一个系列年明智地动态化，我们可以很容易地从 {point.key}。我知道 highstock 不应该像那样工作，但我正在应用这种技巧来生成今年与去年酒吧的比较报告。

注意：为了在一个点上绘制图形，两个柱的时间戳将保持不变，但值将来自去年，以便能够将两个柱一起绘制。

所以我需要通过从 Week from Monday, Aug 9, 2011 的 headerText 中选择年份，动态地将工具提示上的 Previous Year 更改为 2010 并将 Current Year 更改为 2011。

JS Fiddle: https://jsfiddle.net/sfwcqk1w/

Answer 1

您可以通过 tooltip.formatter 完全控制工具提示中显示的内容。您可以在那里进行自己的计算。在工具提示中，您可以访问系列中的所有点。

为启用了数据分组的点添加额外的属性将不起作用 - 在工具提示中你会得到分组的点 - 并且这些点没有额外的属性。

您的工具提示可能如下所示 - 它包含一些默认格式：

formatter: function() {
    var points = this.points;

    var headerFormat = '<span style="font-size: 10px">' + Highcharts.dateFormat('Week from %A, %b %e, %Y', this.x) + '</span><br/>';

    var pointFormat = '',
        previousYear;

    points.forEach(function(point) {
      var name = point.series.name,
        part;

      if (name === 'Previous Year') {
        previousYear = part = new Date(point.x).getFullYear();
      } else if (name === 'Current Year') {
        part = previousYear + 1
      } else {
        part = name;
      }
      pointFormat += '<span style="color:' + point.color + '">\u25CF</span> ' + part + ': <b>' + point.y + '</b><br/>';
    });

    return headerFormat + pointFormat;
  }

示例：https://jsfiddle.net/sfwcqk1w/3/

Highstock：如何使第一列的系列名称在工具提示上动态显示，年份明智

Highstock: how to make series name of first column to be dynamic on tooltip, year wise

highcharts

highstock