Chartjs-How can I reduce the spacing between my legend and chart proper in my Chart.JS bar chart, and increase it in the graph area?

2👍

Inside your variable forecastOptions, you just need to add the so-called scales option.

var forecastOptions = {
    scales: {
        xAxes: [{
            barPercentage: 0.7,
            categoryPercentage: 1
        }]
    },
    tooltips...

This adjusts the width of the bars (barPercentage) and that of all the bars as a whole (categoryPercentage)

You can change 0.7 to however wide you want it to get. The extra space around all the bars is due to the fact that they fall under the same category, and that option is set to 0.8 as default, meaning that the 5 bars will only take up 80% as a whole.

Hope this helps

Leave a comment