当前位置:  开发笔记 > 编程语言 > 正文

Chart.js轴始终显示零

如何解决《Chart.js轴始终显示零》经验,为你挑选了1个好方法。

我正在使用Chart.js创建一个简单的条形图,其中包含从mysql读取的数据。不幸的是,y轴开始于随机数,通常高于某些条形图。因此,有些条形图不可见,尽管它们的值应该足够高:

我已经scaleBeginAtZero: true按照这里的建议使用了-option ,但无济于事:

var ctx = $("#mycanvas");
Chart.defaults.global.scaleBeginAtZero = true;

var barGraph = new Chart(ctx, {
    type: 'bar',
    data: chartdata,
    options: {
        scaleBeginAtZero: true
    }
});

有任何想法吗?完整的代码在这里。



1> Sanjay Dutt..:

好吧,您可以使用下面的代码。因此,条形图的Y轴从零开始。

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

[ 样本代码 ]

var ctx = document.getElementById("myChart1");
var data = {
    labels: ["January", "February", "March", "April", "May", "June", "July"],
    datasets: [
        {
            label: "My First dataset",
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            borderColor: [
                'rgba(255,99,132,1)',
                'rgba(54, 162, 235, 1)',
                'rgba(255, 206, 86, 1)',
                'rgba(75, 192, 192, 1)',
                'rgba(153, 102, 255, 1)',
                'rgba(255, 159, 64, 1)'
            ],
            borderWidth: 1,
            data: [65, 59, 80, 81, 56, 55, 40],
        }
    ]
};
    var myBarChart = new Chart(ctx, {
    type: 'bar',
    data: data,
    options: {
        scales : {
            yAxes : [{
                ticks : {
                    beginAtZero : true
                }   
            }]
        }
    }
});

推荐阅读
虎仔球妈_459
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有