HighCharts 在 xAxis 上显示日期时间格式答案

【问题标题】：HighCharts show datetime format on xAxisHighCharts 在 xAxis 上显示日期时间格式
【发布时间】：2017-04-27 21:11:04
【问题描述】：

我试图在高图表的 x 轴上以日/周/月格式显示 dateTime 我将数据格式化为 x utc 日期时间格式和 y（幅度）。我的印象是我只需要这样做就可以了

Highcharts.chart('container', {
  title: {
    text: 'Chart with time'
  },
  xAxis: {
    type: 'datetime',
    dateTimeLabelFormats: {
      day: "%e. %b",
      month: "%b '%y",
      year: "%Y"
    }
  },
  series: [{
    data: [
      [1493326164493, 100],
      [1493326194018, 120]
    ]
  }]
});

我做错了什么？我在下面为我的场景发布了一个小提琴链接

https://jsfiddle.net/dLfv2sbd/

【问题讨论】：

标签： javascript datetime highcharts

【解决方案1】：

axis.dateTimeLabelFormats 的工作方式有点不同。首先，Highcharts 试图猜测什么是数据的“最佳单位”，例如如果是一天，它将根据 dateTimeLabelFormats 中的天属性进行格式化。

如果您只想格式化轴标签，可以使用axis.labels.format 并指定如下格式：

xAxis: {
  type: 'datetime',
  labels: {
    format: '{value:%Y-%b-%e}'
  },

示例：https://jsfiddle.net/dLfv2sbd/1/

【讨论】：

【解决方案2】：

您可以尝试使用格式化日期

 xAxis: {
   labels: {
    formatter: function(){

      return moment(new Date(this.value)).format('DD'); // example for moment.js date library

      //return this.value;
    },
},

您也可以查看文档http://api.highcharts.com/highcharts/xAxis.labels.formatter

【讨论】：

但这不会只是格式化标签而不是 x 轴值本身
为什么不能在将数据放入 highchart 之前对其进行格式化？

【解决方案3】：

你也可以试试这个-

{值:%Y-%b-%e %l:%M %p }

labels: {
      format: '{value:%Y-%b-%e %l:%M %p }'
},

输出 - 2017 年 4 月 27 日晚上 8:49

格式：'{value:%Y-%b-%e %l:%M}'

labels: {
          format: '{value:%Y-%b-%e %l:%M %p }'
},

输出-2017-Apr-27 8:49

格式：'{value:%Y-%b-%e}'

 labels: {
              format: '{value:%Y-%b-%e}'
 },

输出 - 2017 年 4 月 27 日

格式：'{value:%Y-%b-%e %H:%M}'

labels: {
      format: '{value:%Y-%b-%e %H:%M}'
},

输出 2017-Apr-27 20:49

【讨论】：

【解决方案4】：

简单的年月日格式：

 format: '{value:%Y-%m-%e}'

【讨论】：