Chart.js 条形图最小值不会从零开始

Question

我正在使用Chart.js显示一条折线图，它可以正常工作，但是我希望y轴以0作为最小值开始。现在，y轴从显示的数据中最小值开始。我希望它始终从零开始显示。

这是我正在使用的代码（它可以工作，但是y轴不从0开始）：

<script type="text/javascript">
        $(document).ready(function(){
    $.ajax({
        url : "Get data from here",
        type : "GET",
        success : function(data){
            console.log(data);

      var userid = [];
      var viewers = [];


      for(var i in data) {
        userid.push(data[i].date_time);
        viewers.push(data[i].viewers);

      }

      var chartdata = 
        {
        labels: userid,
        datasets: 
                [
                    {
                    label: "Viewers for <?php echo $month . " - " . $year; ?>",
                    fill: false,
                    lineTension: 0.1,
                    backgroundColor: "rgba(59, 89, 152, 0.75)",
                    borderColor: "rgba(59, 89, 152, 1)",
                    pointHoverBackgroundColor: "rgba(59, 89, 152, 1)",
                    pointHoverBorderColor: "rgba(59, 89, 152, 1)",
                    data: viewers,
                    options: 
                        {
                        responsive: true,
                        scales: {
                            yAxes: [{
                                ticks: {
                                    beginAtZero: true
                                        }
                                    }]
                                }
                        }
                    }
                ]
        };

      var ctx = $("#mycanvas");

      var LineGraph = new Chart(ctx, {
        type: 'line',
        data: chartdata
      });
    },
    error : function(data) {

    }
  });
});
</script>

我添加了这部分内容：

options: 
   {
   responsive: true,
   scales: {
       yAxes: [{
           ticks: {
               beginAtZero: true
                  }
              }]
            }
        }

但是似乎它没有做任何事情，并且继续从所显示数据的最小值开始显示。

- omega1

Answer 1

将 options 部分移至图表创建部分：

var LineGraph = new Chart(ctx, {
    type: 'line',
    data: chartdata,
    options: {
        responsive: true,
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
});

这里有来自文档的一个示例。

- robbannn

---

这在我的v3.8.0版本上没有起作用。 - Mackiavelli

Answer 2

options: {
     resposive: true,
     scales: {
             y: {
                suggestedMin: 0,
                suggestedMax: 100
                }
             }
     }

- Muhammad Zakaria

---

实际上这对我起作用了。我在v3.8.0上尝试过，它可以工作。另一个带有'beginAtZero'的解决方案对我不起作用。 - Mackiavelli

在我的情况下，我使用了 min 而不是 suggestedMin，这将强制在所有情况下都显示零。 - rodrigocfd