web-dev-qa-db-ja.com

HighChartsはxAxisで日時形式を表示します

高いチャートの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/

8
lboyel

axis.dateTimeLabelFormats は少し異なります。そもそも、Highchartsはデータの「最適な単位」を推測しようとします。日である場合、dateTimeLabelFormatsのdayプロパティに従ってフォーマットします。

軸ラベルをフォーマットするだけの場合は、 axis.labels.format を使用して、次のようなフォーマットを指定できます。

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

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

11
morganfree

日付のフォーマットを試すことができます

 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

4
Leguest

これも試すことができます-

  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

2
Samir

単純な年月日形式:

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