javascript - 自定义 highcharts 工具提示以显示日期时间

Question

我正在开发一个项目，预计会显示此图:http://jsfiddle.net/Kc23N/

当我单击一个点(工具提示)时，我想显示一个可以理解的日期，而不是以毫秒为单位的值。

我认为需要更改这段代码:

tooltip: {
      headerFormat: '<b>{series.name}</b><br>',
      pointFormat: '{point.x} date, {point.y} Kg',                        
}

我该怎么办？感谢任何善意的帮助。

谢谢

Answer 1

您可以使用moment.js获取格式化的值，但 Highcharts 有自己的日期格式化功能，这对于 Highcharts 来说更惯用。它可以附加到 highcharts 构造函数中的工具提示选项上，如下所示:

        tooltip: {
            formatter: function() {
                return  '<b>' + this.series.name +'</b><br/>' +
                    Highcharts.dateFormat('%e - %b - %Y',
                                          new Date(this.x))
                + ' date, ' + this.y + ' Kg.';
            }
        }

您可能还想在 xAxis 下添加 dateTimeLabelFormats 对象，其中包含日期所需的选项。

我用你的 code 做了这个示例