2017-04-12 4 views
0

インターバルの日の時間にティックを入れたいのですが、どうすればいいですか?グラフのjsでx軸のラベルを昼間に最小化する方法

enter image description here

チャートラベルはちょうど一日時間でなければなりませんが、私はちょうど時間を置いたとき、それはインターバル時間にティックを入れていない、ダニがたくさんあります。

https://jsfiddle.net/ykm3uvL2/この例題x軸ラベルは24時間ですが、データは100です。このデータを24時間にどのように置くことができますか?

var config = { 
    type: 'line', 
    data: { 
     labels: hourOfDay, 
     datasets: _datasets 
    }, 
    options: { 
     responsive: true, 
     title: { 
      display: true, 
      text: 'Daily Kw Object' 
     }, 
     tooltips: { 
      mode: 'label', 
     }, 
     hover: { 
      mode: 'nearest', 
      intersect: true 
     }, 
     scales: { 
      xAxes: [{ 
       display: true, 
       scaleLabel: { 
        display: true, 
        labelString: 'Time' 
       } 
      }], 
      yAxes: [{ 
       display: true, 
       scaleLabel: { 
        display: true, 
        labelString: _obj.Items[0].ValueType 
       } 
      }] 
     } 
    } 
}; 

var ctx =$("#canvas"+_obj.Id)[0].getContext('2d'); 
window.myLine = new Chart(ctx,config); 
+0

あなたの質問はあまり明確ではありません。あなたは '04:20'ではなく' 04'だけを望んでいますか? –

+0

私はこの04:20ティックを04:00に05:00 –

+0

umm okの間に入れたいと思っています。与えられたイメージはあなたの期待している結果か、あなたのチャートの現在の状態ですか? –

答えて

0

解決しました。 https://jsfiddle.net/fLjcan5d/私を理解しようとしてくれてありがとうmoáois。

var config = { 
type: 'line', 
data: { 
labels: ['00:00','01:15', '02:00', '03:20', '04:00', '05:00', 
'06:00','07:00','08:00','09:00','10:00','11:00', 
    '12:00','13:00','14:00','15:00','16:00','17:00','18:00','23:59'], 
    datasets: [{ 
     label: "My First dataset", 
     data: [1, 3, 4, 2, 1, 4, 2], 
    }] 
    }, 
    options: { 
    scales: { 
     xAxes:[{ 
    type: 'time', 
    time: { 
    format: "HH:mm", 
    unit: 'hour', 
    unitStepSize: 1, 
    displayFormats: { 
     'minute': 'HH:mm', 
     'hour': 'HH:mm', 
     min: '00:00', 
     max: '23:59' 
    }, 
}}], 
    }, 
    } 
}; 
関連する問題