[Chartjs]-Chart.js shrinking

1👍

Answering own question.
Solution appears to be adding maintainAspectRatio: false.

var scanCountChart = new Chart("ScanCountChart", {
    type: "bar",
    data: {
        labels: xVals,
        datasets: [{
            backgroundColor: barColors,
            data: yVals
        }]
    },
    options: {
maintainAspectRatio: false,  // *** Important : this is required or a strange vanishing zoom out effect occurs with the graph. 
        plugins: {
            tooltip: {
                titleFont: {
                    size: 50
                },
                bodyFont: {
                    size: 30
                },
                footerFont: {
                    size: 15 // there is no footer by default
                }
            },
            legend: { display: false },
            zoom: {
                limits: {
                    y: { min: 0, max: 100 },
                    y2: { min: -5, max: 5 }
                },
            }
        },
        scales: {
            x: {
                ticks: {
                    font: {
                        size: xFontSize
                    },
                    maxRotation: 45,
                    minRotation: 25
                }
            },
            y: {
                ticks: {
                    font: {
                        size: yFontSize
                    }
                }
            }
        }
    }
});

Leave a comment