<分区>
我有一个 Canvas ，我想使用 drawImage 在 Canvas 上的当前内容后面绘制图像。
由于 Canvas 上已经有内容(我正在使用 Literally Canvas 创建一个包含图像的 Canvas ，所以我不能先真正绘制图像)，我不能使用 drawImage 在我呈现其余内容之前。
是否可以在 Canvas 上的所有其他内容后面drawImage？
标签 javascript html canvas
<分区>
我有一个 Canvas ，我想使用 drawImage 在 Canvas 上的当前内容后面绘制图像。
由于 Canvas 上已经有内容(我正在使用 Literally Canvas 创建一个包含图像的 Canvas ，所以我不能先真正绘制图像)，我不能使用 drawImage 在我呈现其余内容之前。
是否可以在 Canvas 上的所有其他内容后面drawImage？
最佳答案
是的，你可以使用 globalCompositeOperation destination-over，但请注意，您的第一张图片需要一些透明度，否则，您显然看不到任何东西:
var img1 = new Image();
var img2 = new Image();
var loaded = 0;
var imageLoad = function(){
if(++loaded == 2){
draw();
}
};
img1.onload = img2.onload = imageLoad;
var draw = function(){
var ctx = c.getContext('2d');
ctx.drawImage(img1, 100,100);
// wait a little bit before drawing the background image
setTimeout(function(){
ctx.globalCompositeOperation = 'destination-over';
ctx.drawImage(img2, 0,0);
}, 500);
}
img1.src = "https://dl.dropboxusercontent.com/s/4e90e48s5vtmfbd/aaa.png";
img2.src = "https://picsum.photos/200/200";<canvas id="c" width="200" height="200"></canvas>关于javascript - 如何在 Canvas 上的所有其他内容后面绘制图像？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37359716/