javascript - 如何在 chart.js 中将对数刻度分配给 y 轴？

Question

var data1 = {
        labels: JSON.parse('<?php echo JSON_encode($bioc_months);?>'),
        datasets: [{
                fillColor: "rgba(220,220,220,0.5)",
                strokeColor: "rgba(220,220,220,1)",
                pointColor: "rgba(220,220,220,1)",
                pointStrokeColor: "#fff",
                data: 1000,
                900,
                90,
                200,
                1020
            }, {
                fillColor: "rgba(151,187,205,0.5)",
                strokeColor: "rgba(151,187,205,1)",
                pointColor: "rgba(151,187,205,1)",
                pointStrokeColor: "#fff",
                data: 600,
                456,
                20,
                2,
                900
            ]
        };

        var opt1 = {
            canvasBordersWidth: 3,
            canvasBordersColor: "#205081",
            scaleOverride: true,
            scaleSteps: 6,
            scaleStepWidth: log2,
            scaleStartValue: 0,
            scaleLabel: "<%=value%>",
            legend: true,
            inGraphDataShow: true,
            annotateDisplay: true,
            inGraphDataShow: false,
            annotateDisplay: true,
            animationEasing: "easeOutBounce",
            graphTitleFontSize: 18
        };

        var myBarChart1 = new Chart(ctx1).Bar(data1, opt1);

Answer 1

您可以将对数刻度分配给 y 轴，如下所示:

yAxes: [{
    scaleLabel: {
        display: true,
        labelString: 'LABEL',
    },
    type: 'logarithmic',
    position: 'left',
    ticks: {
         min: 0.1, //minimum tick
         max: 1000, //maximum tick
         callback: function (value, index, values) {
             return Number(value.toString());//pass tick values as a string into Number function
         }
    },
    afterBuildTicks: function (chartObj) { //Build ticks labelling as per your need
        chartObj.ticks = [];
        chartObj.ticks.push(0.1);
        chartObj.ticks.push(1);
        chartObj.ticks.push(10);
        chartObj.ticks.push(100);
        chartObj.ticks.push(1000);
    }
}]