HighCharts在Xaxis上显示DateTime格式



我试图在高图的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/

axis.datetimelabelformats的作用有所不同。首先,HighCharts试图猜测您数据的"最佳单元"是什么,例如如果是一天,它将根据DATETIMELABELFORMATS的Day属性进行格式化。

如果您只想格式化轴标签,则可以使用axis.labels.format并指定这样的格式:

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

示例:https://jsfiddle.net/dlfv2sbd/1/

您可以尝试使用

的格式日期
 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.formatter

您也可以尝试 -

  1. {值:%y-%b-%e%l:%m%p}
labels: {
      format: '{value:%Y-%b-%e %l:%M %p }'
},

输出-2017-APR-27 8:49 PM

  1. 格式:'{值:%y-%b-%e%l:%m}'
labels: {
          format: '{value:%Y-%b-%e %l:%M %p }'
},

输出-2017-APR-27 8:49

  1. 格式:'{值:%y-%b-%e}'
 labels: {
              format: '{value:%Y-%b-%e}'
 },

输出-2017-APR-27

  1. 格式:'{值:%y-%b-%e%h:%m}'
labels: {
      format: '{value:%Y-%b-%e %H:%M}'
},

输出2017-APR-27 20:49

简单的年度周期格式:

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

最新更新