html5畫布長寬比？

Question

在html5 canvas元素中，我使用默認的高寬比。 Firefox和Safari中的canvas元素的默認長寬比至少爲 ，寬度和高度似乎爲2/1。這是高度爲 和寬度的唯一組合，該寬度將爲繪製到 畫布元素的矩形產生1：1縱橫比。

那麼，我應該如何設置畫布元素的縱橫比，使得 對於繪製物品的比例爲1：1？

我有一個Coding論壇的帳戶，並沒有得到足夠的迴應。 我已經獲得了一些有關該主題的打印文本，但他們沒有解決這個問題。 我一直在編程javascript/html/css至少10年。

我希望我不會陷入不可改變的默認比例。

查看類似問題的列表，我沒有看到這個問題。

Answer 1

畫布可以擁有獨立於Dom元素的寬度和高度。 這導致非1：1的寬高比。

要解決您需要設置寬度和高度屬性以匹配包含元素的dom的寬度和高度。

例如，在jquery中，您可以執行以下操作。 （'canvas'）。attr（'width'，'100'）。attr（'height'，'100'）;

這將使您的畫布成爲100像素的正方形。假設這是一個具有匹配的寬度和高度屬性的DOM元素，那麼你將得到1：1的寬高比。