現状
Vue.js / Chart.js (vue-chartjs)を用いて線グラフを表示しています。
グラフ表示のオプションとして、yAxesに以下のオブジェクトを渡しています。
javascript
1 yAxes: [ 2 { 3 type: "linear", 4 position: "left", 5 ticks: { 6 max: 10, 7 min: -20, 8 beginAtZero: false, 9 stepSize: 3, 10 callback: (value, index, values) => { 11 return `${value}℃` 12 } 13 } 14 }
この通り、maxは10、minは-20まで、stepSizeは3なので理想は
10, 7, 4, 1, -2, -5, -8, -11, -14, -17, -20
と表示されるものですが、実際は
10, 9, 6, 3, 0, -3, -6, -9, -12, -15, -18, -20
と、一旦0を基準にするような値で表示されてしまいます。
あまり関係ないかも知れませんが、ダミーで渡してるデータは
[4.9, 5, 2.1, 4.8, 5, 1.9, 1, 2.9, 4.4, 5.5]
です。
解決したい内容
y軸を期待どおり
10, 7, 4, 1, -2, -5, -8, -11, -14, -17, -20
と表示するためにどのようなオプションを渡せば良いでしょうか?
バージョン情報
Nuxt.js 2.15.8
Vue.js 2.6.14
Chart.js 2.8
vue-chartjs 3.4.2
あなたの回答
tips
プレビュー