如何设置图表的yAxis比例尺?

时间:2018-12-19 20:15:06

标签: chart.js

我需要设置yAxis比例尺,以使其从零开始到100且间隔为10。我尝试过使用该比例尺的几个选项,但它似乎不起作用。我也尝试设定 选项:{比例尺:{y轴:[{滴答声:{beginAtZero:true}}]}}});

但这没有帮助,我在yAxis比例上仍然为负数。我该怎么解决?

    var MONTHS = ["Январь", "Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь", "Декабрь"];
    var config = {
        type: 'line',
        data: {
            labels: ["Январь", "Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь", "Декабрь"],
            datasets: [{
                label: "Продажи",
                backgroundColor: window.chartColors.red,
                borderColor: window.chartColors.red,
                data: [
                    10,
                    randomScalingFactor(),
                    randomScalingFactor(),
                    randomScalingFactor(),
                    randomScalingFactor(),
                    randomScalingFactor(),
                    randomScalingFactor()
                ],
                fill: false,
            }]
        },
        options: {
            responsive: true,
            title:{
                display:true,
                text:'Показатели роста продаж'
            },
            tooltips: {
                mode: 'index',
                intersect: false,
            },
            hover: {
                mode: 'nearest',
                intersect: true
            },
            scales: {
                xAxes: [{
                    display: true,
                    scaleLabel: {
                        display: true,
                        labelString: 'Месяц'
                    }
                }],
                yAxes: [{
                    display: true,
                    scaleLabel: {
                        display: true,
                        labelString: 'Рост'
                    }
                }]
            }
        }
    };

    window.onload = function() {
        var ctx = document.getElementById("chart-0").getContext("2d");
        window.myLine = new Chart(ctx, config);
    };

1 个答案:

答案 0 :(得分:0)

您需要设置ticks选项的yAxes属性。请参考下面的代码或小提琴-> http://jsfiddle.net/Lzo5g01n/10/

始终确保您引用Chart.js库的最新版本。

yAxes: [{
        display: true,
        scaleLabel: {
          display: true,
          labelString: 'Рост'
        },
        ticks:{
            min: 0,
          max: 100,
          beginAtZero: true, 
          stepSize: 5
        }
      }]
相关问题