How to set width of bar dynamically in chart.js?

by

6👍

✅

Check this out

barThickness

Manually set width of each bar in pixels. If not set, the base sample
widths are calculated automatically so that they take the full
available widths without overlap. Then, the bars are sized using
barPercentage and categoryPercentage.

Your code should be something like this:

var myBarChart = new Chart(ctx, {
    type: 'bar',
    data: data,
    options: {
       scales: {
          xAxes: [{
             barThickness: 10
          }]
    }
});

I made this example for you

👍:0

Solution

You can set it on the Chart object

import {Chart} from "chart.js"

Chart.defaults.datasets.bar.barThickness = 73;

//also try barPercentage, maxBarThickness

Leave a comment