Javascript 缩放画布元素并保持纵横比

我有一个简单的html5页面，其中有一个特定大小的画布元素。现在，我希望canvas元素始终根据页面的可用大小进行缩放，但仍保持一定的纵横比

另外，如何在javascript代码中获取画布元素的当前比例因子

---

谢谢

如果w是你的宽度，h是你的高度。 w/h是你的比率

现在您的页面宽度变大或变小。 假设您的新宽度名称为newW。 你正在寻找新的

要保持您的比率，只需进行以下计算： newH=newW/（w/h）

要获得宽度和高度，只需使用document.getElementById（“canvas”）。宽度/高度应该可以

canvas {
 outline: 0px;
 position: absolute;
 left: 0px;
 top: 0px;
 width: 100%;
 height: auto;
}

---

这里的关键是，高度自动调整到画布元素所处的任何纵横比。

技术工作得非常完美，因此这个答案确实值得接受。