HTML5畫布調整大小和上下文座標

Question

我試圖畫一個圖像到我的畫布。我已經在html中定義了我的畫布，並使用JS來調整它的大小。當我使用的drawImage功能（圖像的大小較大例如）

var can = document.getElementById('myCanvas'); 
can.style.width = (window.innerWidth-20) + "px"; 
can.style.height = "860px"; 
var context=can.getContext("2d"); 
var img=document.getElementById("boje"); 
context.drawImage(img,50,0,400,140); 

的位置和大小的屬性不知何故座標是不正確的調整大小後的畫布。例如，如果我定義在HTML調整大小之前HTML的畫布的尺寸，座標是真正的HTML定義。

是否可以「重置」2d上下文以使用調整大小的畫布的實際座標？

謝謝。

Answer 1

你還沒有使用JS調整它的大小，你已經使用CSS調整了它（style）。這只是像其他圖像一樣縮放。直接設置width和height屬性：

can.width = (window.innerWidth-20); 
can.height = 860;