Question

我正在尝试删除条形图条之间的空间，但即使我看到这个解决方案很多地方也不适用于我。它在Chart.js文档中也没有提到，所以这很奇怪。有人能告诉我如何指定吗？

var options = {
    barValueSpacing : 1,        // doesn't work; find another way
    barDatasetSpacing : 1,      // doesn't work; find another way

    legend: {
        display: false          // Hides annoying dataset label
    },
    tooltips: {
        callbacks: {
            label: function(tooltipItem) {
                return tooltipItem.yLabel;
            }
        }
    }
};

var ctx = document.getElementById("canvasX").getContext("2d");          
var myBarChart = new Chart(ctx, {
    type: 'bar',
    data: data,
    options: options
});

Answer 1

您需要在x轴刻度上将barPercentage和categoryPercentage设置为1.0。将其添加到options对象：

var options = {
    ...
    scales: {
        xAxes: [{
            categoryPercentage: 1.0,
            barPercentage: 1.0
        }]
    }
};

请参阅http://www.chartjs.org/docs/#bar-chart-chart-options

Answer 2

在 3.2.0 版中，将每个数据集中的 barPercentage 和 categoryPercentage 设置为 1.0：

var datasets = [
  {
    ...
    barPercentage: 1.0,
    categoryPercentage: 1.0
  }
]

查看https://www.chartjs.org/docs/3.2.0/charts/bar.html了解更多详情

Chart.js条形图：如何删除v2.3中栏之间的空格？

2 个答案: