chart.jsで0からの線グラフを実装したいです

Question

chart.jsで線グラフを実装しましたが、Y軸の一番下の値は、dataに含まれる一番低い数値になってしまいます。
0で固定したいと思い、さまざまなコードを試しましたが、解決できなかったので教えていただきたいです。

      Vue.component('line-chart03', {
            extends: VueChartJs.Line,
            mounted () {
              this.renderChart({
                labels: ['2021/11/1', '2021/11/2', '2021/11/3', '2021/11/4', '2021/11/5', '2021/11/6', '2021/11/7'],
                datasets: [
                  {
                    label: 'アクセス数',
                    backgroundColor: 'rgba(149, 157, 223,  0.6)',
                    data: [40, 39, 10, 33, 55, 80, 40],
                    fill:true,
                    borderColor:'#666EDD',
                  }
                ]
              }, 
              {
                responsive: true,
                maintainAspectRatio: false,
                animation: false,
                plugins: 
                {
                  legend : 
                  {// 凡例の非表示
                    display : false
                  },
                  scales: {
                    yAxes: {
                      ticks: {
                        beginAtZero: true // ここの処理が反映されません
                      }
                    }
                  }
                },
              })
            }
        });

Answer 1

さまざまなコードを試しましたが、

こちらも具体的に記載しておいた方が良いかもしれませんね。

Namespace: options.scales[scaleId]
beginAtZero boolean if true, scale will include 0 if it is not already included.
https://www.chartjs.org/docs/latest/axes/cartesian/linear.html

VueからChart.jsを使用したことがないのですが、
リファレンスを見ますと、指定する場所(Namespace)が違うような気もしますね。
(Chart.jsのバージョンなども明記していただいた方が良いかもしれませんね)

options: {
    scales: {
        y: {
            suggestedMin: 50,
            suggestedMax: 100
        }
    }
}

https://www.chartjs.org/docs/latest/axes/#axis-range-settings

違うかもしれませんが、こちらも検討してみたらどうかなと思います。

Comments

[nf10131999]

解決しました！
ありがとうございます！