[Chartjs]-Chart.js is always increasing height on chart.resize()

by

44👍

I had the same thing. You have to put an empty div around the canvas.

5👍

I’ve found some users had the same issue in this post: https://github.com/jtblin/angular-chart.js/issues/84

The solution for me was to change the chart’s options to maintainAspectRatio: false.

    myChart.setOptions({
        responsive: true,
        maintainAspectRatio: false
    });

1👍

In laravel livewire i fixed adding wire:ignore to wrapper div

<div wire:ignore>
    <div class="chart-container" style="height: 80vh; width: 80vh;">
       <canvas id="bar-chart" height="800" width="1500"></canvas>
    </div>
</div>

-2👍

I was having the same issue in a Bulma tile.

The fix was to set
responsive: false in the Chart.js script options area.

Leave a comment