我正在为ChartJS的大小调整而挣扎，我现在已经尝试了很多选项...但都很失败。通过以下选项，我至少实现了图表的所需位置和大小。数据都是正确的，但它显示所有压扁....（数据正在从我的后端用handlebars推送...）.现在我想得到我的数据“unsquashed”。我将此数据转换为PDF与 puppet 库，但我不相信这是问题，因为我已经看到在某些设置我的数据所需的..先谢谢你了！
Desired CHART look
Actual...

<style>
    .container {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .test { 
        width: 100%;
        max-width: 400;
        height: 225;
    }
</style>
<div class="container">
    <div class="test">
        <canvas id="myChart"></canvas>
    </div>
</div>

<script>
document.addEventListener("DOMContentLoaded", function () {
    var envelope = {{{envelopeJSON}}};
    var utility = {{{utilityJSON}}};
    var mb = {{{mbJSON}}};
    new Chart("myChart", {
        type: "scatter",
        data: {
            datasets: [
                {
                    label: "{{airplanename}}",
                    pointRadius: 4,
                    pointBackgroundColor: "rgb(0, 0, 255)",
                    data: envelope,
                    showLine: true,
                    fill: true,
                    borderColor: "rgb(0, 150, 255)", 
                    backgroundColor: "rgba(0, 0, 255, 0.2)"
                },
                {
                    label: "Utility",
                    pointRadius: 4,
                    pointBackgroundColor: "rgb(255, 36, 0)",
                    data: utility,
                    showLine: true,
                    fill: true,
                    borderColor: "rgb(255, 36, 0, 0.5)", 
                    backgroundColor: "rgba(255, 36, 0, 0.2)" 
                },
                {
                    label: "Data",
                    pointRadius: 4,
                    pointBackgroundColor: "rgb(0, 0, 255)",
                    data: mb,
                    showLine: true,
                    borderColor: "rgb(0, 150, 255)", 
                }
            ]
        },
        options: {
            //responsive: false,
            //maintainAspectRatio: false,
            legend: { display: false },
            scales: {
                xAxes: [{ ticks: { min: 80, max: 90 } }],
                yAxes: [{ ticks: { min: 1000, max: 2500 } }],
            }
        }
    });
});
</script>

我已经尝试了许多配置，变量：响应和维护方面我已经作为一个评论，我不知道什么配置是适合这个问题....