Javascript 调整画布的大小，并将调整大小的内容复制到另一个画布中

如何将调整大小的画布的内容复制到另一个画布中

如果我在画布中绘制一个图像，然后调整其大小，当我克隆内容时，我会将第一个画布复制为其原始大小，即使它已调整大小

html:

---

更改画布元素的大小不会更改基础图像光栅的大小。这与

img

标签非常相似，更改大小不会更改图像的实际内容

如果要绘制图像的缩放版本，只需使用五参数版本的

context2d.drawImage（）

：

---

是一个很好的去处；这本书很值得一读，但就像吃蔬菜一样，它对你有好处。

嘿，为了更容易提供帮助，你应该在JSFIDLE或类似的网站上展示你的例子。示例：@ellisbben完全改写了问题，非常感谢！如果是画布规范为你做的，你让我的书签管理员脸红了。

<img id="image" src="the-image.png" width="275" height="95"/>
<canvas id="canvas-image" width="275" height="95"></canvas>
<canvas id="canvas-little" width="138" height="48"></canvas>

var img = $('image');   

var cnvImage = $('canvas-image');
ctxImage = cnvImage.getContext('2d');
ctxImage.drawImage(img,0,0);

cnvImage.setStyles({ 'width': 138, 'height': 48 });

var cnvLittle= $('canvas-little');
ctxLittle = cnvLittle.getContext('2d');
ctxLittle.drawImage(cnvImage,0,0);

context.drawImage(image, destinationX, destinationY, destinationHeight, destinationWidth);