วิธีตั้งค่าเริ่มต้นเป็น“ 0” ในชาร์ต js

นี่คือรหัสของฉัน ฉันต้องตั้งค่าเริ่มต้นเป็น "0" ทั้งในสเกลแกน x และ y ฉันได้ลองตัวเลือกเครื่องชั่งรุ่นล่าสุดแล้ว

graphOptions = {               
            ///Boolean - Whether grid lines are shown across the chart
            scaleShowGridLines: false,    
            tooltipTitleTemplate: "<%= label%>",
            //String - Colour of the grid lines
            scaleGridLineColor: "rgba(0,0,0,.05)",
            //Number - Width of the grid lines
            scaleGridLineWidth: 1,
            //Boolean - Whether to show horizontal lines (except X axis)
            scaleShowHorizontalLines: true,
            //Boolean - Whether to show vertical lines (except Y axis)
            scaleShowVerticalLines: true,
            //Boolean - Whether the line is curved between points
            bezierCurve: true,
            //Number - Tension of the bezier curve between points
            bezierCurveTension: 0.4,
            //Boolean - Whether to show a dot for each point
            pointDot: true,
            //Number - Radius of each point dot in pixels
            pointDotRadius: 4,
            //Number - Pixel width of point dot stroke
            pointDotStrokeWidth: 1,               
            pointHitDetectionRadius: 20,               
            datasetStroke: true,
            datasetStrokeWidth: 2,
            datasetFill: true,               
            legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].strokeColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>"
        };
        var LineChart = new Chart(ctx).Line(graphData, graphOptions);
   }     

สำหรับ Chart.js 2. * ตัวเลือกสำหรับขนาดที่จะเริ่มต้นที่ศูนย์แสดงภายใต้การตั้งค่าตัวเลือกของการวัดเชิงเส้น ค่านี้ใช้สำหรับข้อมูลตัวเลขซึ่งส่วนใหญ่น่าจะเป็นกรณีของแกน y ของคุณ ดังนั้นคุณต้องใช้สิ่งนี้:

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

นอกจากนี้ยังมีแผนภูมิเส้นตัวอย่างที่นี่ซึ่งใช้ตัวเลือกสำหรับแกน y หากข้อมูลตัวเลขของคุณอยู่ในแกน x ใช้แทนxAxes yAxesโปรดทราบว่าอาร์เรย์ (และพหูพจน์) ใช้สำหรับyAxes(หรือxAxes) เนื่องจากคุณอาจมีหลายแกนเช่นกัน

หากคุณต้องการใช้เป็นค่าเริ่มต้นให้วางmin: 0ภายในโหนดdefaults.scale.ticksดังต่อไปนี้:

defaults: {
  global: {...},
  scale: {
    ...
    ticks: { min: 0 },
  }
},

อ้างอิง: https://www.chartjs.org/docs/latest/axes/

โปรดเพิ่มตัวเลือกนี้:

//Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
scaleBeginAtZero : true,

(อ้างอิง: Chart.js )

หมายเหตุ:วิธีแก้ปัญหาเดิมที่ฉันโพสต์ไว้สำหรับ Highcharts หากคุณไม่ได้ใช้ Highcharts โปรดลบแท็กออกเพื่อหลีกเลี่ยงความสับสน