圖表js圖表條形圖未顯示0的數據

Question

我有一個圖表js條形圖。 它沒有顯示來自0的數據。如果具有值3和7，則圖形將3作為y軸起點，將7作為最高軸。 類似地，如果我有5和8，則第一欄將變為空白，第二欄可見。

我補充說：

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

我的代碼：

$(document).ready(function () {
            showGraph();
        });


        function showGraph()
        {
            {
                $.post("data.php",
                function (data)
                {
                    console.log(data);
                     var name = [];
                    var marks = [];

                    for (var i in data) {
                        name.push(data[i].label);
                        marks.push(data[i].y);
                    }
                    console.log(name);
                    console.log(marks);

                    var chartdata = {
                        labels: name,
                        datasets: [
                            {
                                label: 'Student Marks',
                                backgroundColor: '#49e2ff',
                                borderColor: '#46d5f1',
                                hoverBackgroundColor: '#CCCCCC',
                                hoverBorderColor: '#666666',
                                data: marks
                            }
                        ]

                    };

                    var graphTarget = $("#graphCanvas");

                    var barGraph = new Chart(graphTarget, {
                        type: 'bar',
                        data: chartdata
                    });
                });
            }
        }

Answer 1

嘗試選項ticks.beginAtZero ，請參閱以下工作片段...

 $(document).ready(function() { var chartdata = { labels: ['a', 'b'], datasets: [{ label: 'Student Marks', backgroundColor: '#49e2ff', borderColor: '#46d5f1', hoverBackgroundColor: '#CCCCCC', hoverBorderColor: '#666666', data: [3, 7] }] }; var graphTarget = $("#graphCanvas"); var barGraph = new Chart(graphTarget, { type: 'bar', data: chartdata, options: { scales: { yAxes: [{ ticks: { beginAtZero: true } }] } } }); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.min.js"></script> <canvas id="graphCanvas"></canvas>