在css中设置高度和宽度时，为什么chart.js图形没有动画？

我注意到我的chart.js图表没有动画效果。我看到一篇帖子说设置高度和宽度可能是个问题。因此，我尝试删除css文件中的高度和宽度。在我移除它之后，图形的动画效果非常好。当然，我想要的图形的高度和宽度都不见了。如何在不影响图形动画的情况下设置图形的高度和宽度

chart.js

---

请分享绘制图表的代码以及剩余的css好吗？@WhiteHat我已经编辑了这篇文章。谢谢，请分享绘制图表的代码，以及剩余的css？@WhiteHat我已经编辑了这篇文章。谢谢

<div class="lineGraph"> 
                    <canvas id="lineChart"></canvas>
                <script>

                    const CHART = document.getElementById("lineChart");
                    console.log(CHART);

                    let lineChart = new Chart(CHART, {
                        type: 'line',
                        data: {
                            labels: ["January", "Feburary", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
                            datasets: [
                                {
                                    label: "Sales Trend",
                                    fill: false,
                                    lineTension: 0.1, 
                                    backgroundColor: "rgba(75, 192, 192, 0.4)",
                                    borderColor: "rgba(75, 192, 192, 1)",
                                    borderCapStyle: 'butt',
                                    borderDash: [],
                                    borderDashOffSet: 0.0,
                                    borderJoinStyle: 'miter',
                                    pointBorderColor: "rgba(75, 192, 192, 1)",
                                    pointBackgroundColor: "#fff",
                                    pointBorderWidth: 1,
                                    pointHoverRaduis: 5, 
                                    pointHoverBackgroundColor: "rgba(75, 192, 192,1)",
                                    pointHoverBorderColor: "rgba(220,220,220,1)",
                                    pointHoverBorderWidth: 2,
                                    pointRaduis: 1,
                                    pointHitRaduis: 10,
                                    data: [65, 59, 80, 81, 56, 55, 40, 36, 77, 21, 44, 60]  
                                }
                            ]
                        },
                        options:{
                            scales:{
                                yAxes:[{
                                    ticks:{
                                        beginAtZero: true
                                    }
                                }]
                            },
                            animation:{
                                duration: 1000,
                                easing: "linear",
                                animateScale: true
                            }
                        }
                    }); 
                </script>
                </div>

.lineGraph{
    height: 100%;
    width: 52%;
    background-color: white;
    float: left;

}