Javascript HTML画布：使用createPattern打印的图像被放大

我有一个问题，我传递给createPattern的任何图像都会放大2倍以上。我尝试使用：

contextInQuesiton.scale(1,1)

但图像最初仍然是放大的，我有明确的指示

有什么想法吗

代码如下所示

app.canvas = document.getElementById('thecanvas');
app.context = app.canvas.getContext('2d');

var bgImg  = new Image();
bgImg.src  = 'bg.png';

bgImg.onload = function() {
    var bgDraw = app.context.createPattern(bgImg, 'repeat-y');
    app.context.rect(0, 0, 1000, 600);
    app.context.fillStyle = bgDraw;
    app.context.fill();
}

编辑：解决方案：

---

问题是我没有在canvas元素本身上设置宽度和高度。我先用javascript设置，然后用css设置。这两种方法都导致了缩放问题。当我把高度和宽度放回到标签上时，一切都恢复正常。奇怪。

contextInQuestion.scale（1，1）

没有任何作用。它将画布上的所有点映射到它们的当前位置，而不会产生任何可见效果

---

如果画布上的所有内容都是您希望的两倍大，并且您希望将其缩放到当前大小的一半，则可以使用：

contextInQuestion.scale（0.5,0.5）

contextInQuestion.scale（1,1）

不起任何作用。它将画布上的所有点映射到它们的当前位置，而不会产生任何可见效果

---

如果画布上的所有内容都是您希望的两倍大，并且您希望将其缩放到当前大小的一半，则可以使用：

contextInQuestion.scale（0.5，0.5）

使用再现问题的代码将非常有帮助。你能做一个简单的说明吗？为了将来的参考，CSS的宽度和高度与画布的宽度和高度属性不同。html属性设置要绘制的像素数（如分辨率），CSS设置显示的大小。一般来说，你根本不需要CSS。拥有重现问题的代码会很有帮助。你能做一个简单的说明吗？为了将来的参考，CSS的宽度和高度与画布的宽度和高度属性不同。html属性设置要绘制的像素数（如分辨率），CSS设置显示的大小。一般来说，你根本不需要CSS。当我去做一个例子时，我意识到错在哪里。我正在用javascript将画布调整到配置的宽度和高度。然而，我在做其他事情之前就做了这件事，这就是为什么我没有想到它。也许js的异步特性是在调整大小之前打印模式。谢谢你抽出时间来帮忙！。。事实上，问题还在发生！虽然缩小到0.3，但0.3使其看起来正常。不管怎样，我都不认为这是正常的行为。@JeffK你是在用CSS调整画布大小吗？当我去做一个例子时，我意识到出了什么问题。我正在用javascript将画布调整到配置的宽度和高度。然而，我在做其他事情之前就做了这件事，这就是为什么我没有想到它。也许js的异步特性是在调整大小之前打印模式。谢谢你抽出时间来帮忙！。。事实上，问题还在发生！虽然缩小到0.3，但0.3使其看起来正常。不管怎样，我不认为这是正常的行为。@JeffK你是在用CSS调整画布的大小吗？