Question

我使用chartjs-node创建图表，并使用Y轴标签。

我的问题是Y轴刻度和标签之间的距离很小，看起来不太好。我已经浏览了文档，无法找到对此方案有用的所有内容...... 选项下有一个选项 - ＆gt;尺度 - ＆gt; yAxes - ＆gt;蜱 - ＆gt;填充但它没有达到预期的效果。

目前我在选项 - ＆gt;下有一个解决方法尺度 - ＆gt; yAxes - ＆gt;蜱 - ＆gt;回调我手动插入空格： TIdIOHandler.ReadStream()

这有效，但显然不是正确的用法，我相信如果比例是线性的，这种方法将禁止我使用线性比例的一些可用功能。

任何人都知道如何以更优雅的方式创建刻度线和标签之间的分隔？

Answer 1

可以使用 afterFit y轴的回调函数来实现：

scales: {
   yAxes: [{
      afterFit: function(scale) {
         scale.width = 80 //<-- set value as you wish 
      },
      ...
   }]
}

ɪɴᴀᴄᴛɪᴏɴ

var chart = new Chart(ctx, {
   type: 'line',
   data: {
      labels: ['Jan', 'Feb', 'Mar'],
      datasets: [{
         label: 'LINE',
         data: [3, 2, 4],
         backgroundColor: 'rgba(0, 119, 290, 0.2)',
         borderColor: 'rgba(0, 119, 290, 0.6)'
      }]
   },
   options: {
      responsive: false,
      scales: {
         yAxes: [{
            afterFit: function(scale) {
               scale.width = 80  //<-- set value as you wish 
            },
            scaleLabel: {
               display: true,
               labelString: 'y-axis label',
            }
         }]
      }
   }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script>
<canvas id="ctx" height="180"></canvas>

Chartjs：如何在刻度和刻度标签之间创建填充

1 个答案: