HTML5画布调整大小和上下文坐标

我试图在画布上画一幅图像。我已经用html定义了画布，并使用JS调整了画布的大小

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);

当我使用drawImage函数时，位置和大小属性的坐标在调整大小的画布上并不真实（例如，图像的大小更大）。例如，如果我在JS resize之前在html中定义画布的维度，则坐标与html定义一致

是否可以“重置”2d上下文以使用调整大小的画布的真实坐标

---

谢谢。

您没有使用JS调整大小，而是使用CSS（

style

）调整大小。这只是像其他图像一样缩放它。直接设置

宽度

和

高度

属性：

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