chart.js - 对数 yaxsis 设置在 chartjs 中不起作用

Question

我以前在 plotly 方面有过经验，现在我正在尝试使用 Chart.js 进行类似的图表。在 plotly 我可以设置yaxis_type="log"，它将自动缩放 Y 轴的值。我正在尝试在 chart.js 中做类似的事情，但无法实现所需的输出。

我的 chart.js 输出看起来像

Y 轴从 0 开始，直接跳到 20000 ，因此很难将前三行可视化。我希望它根据值进行相应的缩放。

我的 JS 代码：

<script type="text/javascript">
var ctx = document.getElementById('myChart');
var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: {{xaxis|safe}},
        datasets: {{data_Categoryline|safe}}
    },
    options: {
        title: {
            display: true,
            text: 'Category wise Trend'
        },
        scales: {
            xAxes: [{
                display : true,
                scaleLabel :{
                    display : true,
                    labelString : 'Across the days/weeks/months'
                }           
            }],
            yAxes: [{
                ticks: {
                    beginAtZero: false,
                     type: 'logarithmic'
                },
                scaleLabel :{
                    display : true,
                    labelString : 'Total Amount'
                } 

            }]
        },
        legend: {
            position : 'right'
        }
    }
});
</script>

标签： chart.js

Answer 1

轴type不能在ticks选项内部定义，而是直接在轴上定义，如下所示：

yAxes: [{
  type: 'logarithmic',
  ticks: {
    beginAtZero: false        
  },

请参阅Chart.js 文档中的笛卡尔坐标轴通用配置。