Skip to content Skip to sidebar Skip to footer

Chart.js Bar Chart: How To Remove Space Between The Bars In V2.3?

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 t

Solution 1:

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

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


Solution 2:

In version 3.2.0 set barPercentage and categoryPercentage to 1.0 within each data set:

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

See https://www.chartjs.org/docs/3.2.0/charts/bar.html for more details


Post a Comment for "Chart.js Bar Chart: How To Remove Space Between The Bars In V2.3?"