当用户调整页面大小时，图形变得混乱。

Question

我已经完成了我的图表，并已经开始尝试把它放到一个。<article> 标签的事情是，当我调整我的页面大小时，它变得混乱，并停止适合的标签内，有什么办法来解决这个问题？

截图。

代码：

<article>
   <canvas id="myChart" style="width:676px;height:300px;"></canvas>
   <!-- if there is a way It would be cool for it just to fill to the article -->
</article>

var myChart = new Chart(ctx, {
    type: "line",
    data: {.....},
    options: {...}

article {
    display: flex;
    height: 300px;
    background: var(--page-content-blockColor);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
}

我试过了

responsive:true,
maintainAspectRatio: false

Answer 1

谢谢用户：Ezra Siton,

改用VH和VW似乎对我有用!

:)

(发这个帖子是为了让我可以结束这个问题)