LoginSignup
0
0

More than 3 years have passed since last update.

【chart.js】X軸の間隔の調整

Posted at

ラズパイで室温と湿度ラズパイのCPU温度をchart.jsで書いてみたけど、X軸の間隔が微妙すぎる。

スクリーンショット 2020-07-01 12.44.57.png

理想は1時間単位のX軸にしたい。

取得時の時刻をタイムスタンプにする

取得時の日時をタイムスタンプとすることでX軸でのメモリ幅のオプションstepSizeに任意な数字を入れて区切ることができるのではないかと思った。

...中略...
          ticks: { // 目盛り
            // fontColor: "red", // 目盛りの色
            // fontSize: 14 // フォントサイズ
            begintZero: true,
            minRotation: 0, // ┐表示角度水平
            maxRotation: 0, // ┘
            maxTicksLimit: 24,
            stepSize: 20,
          }
...中略...

しかし、Y軸のstepSizeは機能するのにX軸のstepSizeが機能しない。


Y軸の区切りを10単位に変更。X軸区切りは1500000000
スクリーンショット 2020-07-01 13.43.47.png
Y軸の区切りが20単位に変更。X軸区切りは1500000000
スクリーンショット 2020-07-01 13.44.04.png
このようにX軸の区切りはなぜか変わらない。
chart.jsの使い方から始めなければいけないのか。。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0