Chart.js 条形图:如何在 v2.3 中删除条形之间的空间?

Chart.js Bar Chart: How to remove space between the bars in v2.3?(Chart.js 条形图:如何在 v2.3 中删除条形之间的空间?)

问题描述

我正在尝试删除条形图条之间的空间，但即使我在很多地方都看到了这种解决方案，但它对我不起作用.Chart.js 文档中也没有提到它，所以这很奇怪.谁能告诉我如何指定它?

I'm trying to remove the space between my bar chart bars, but even though I see this solution many places it doesn't work for me. It's also not mentioned in the Chart.js docs so that is odd. Can someone tell me how to specify it?

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
});

推荐答案

需要在x上设置barPercentage和categoryPercentage为1.0轴刻度.将此添加到您的 options 对象:

You need to set barPercentage and categoryPercentage to 1.0 on the x-axis scale. Add this to your options object:

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

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

这篇关于Chart.js 条形图:如何在 v2.3 中删除条形之间的空间?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！