Javascript 从多张画布制作图像

如何从多张画布制作一张IMG？我想在我的web应用程序中添加一个按钮，从更多的重叠画布中生成一张图像。我找到了这个选项，但我不知道如何使它与多张画布一起工作到一张图像。 多谢各位

function print() {
var canvas = document.getElementById("mycanvas");
var img    = canvas.toDataURL("image/png");
document.write('<img src="'+img+'"/>');
}

函数打印（）{
var canvas=document.getElementById（“mycanvas”）；
var img=canvas.toDataURL（“image/png”）；
文件。写（“”）；
}

只需将画布绘制到主画布中：

假设他们有身份证：

var canvasMain = document.getElementById('canvasMain'); //destination canvas
var ctx = canvasMain.getContext('2d');

var canvas1 = document.getElementById('canvas1');       // layer 1
var canvas2 = document.getElementById('canvas2');       // layer 2
var canvas3 = document.getElementById('canvas3');       // layer 3

ctx.drawImage(canvas1, 0, 0);    // draw canvas 1 into main canvas
ctx.drawImage(canvas2, 0, 0);    // draw canvas 2 into main canvas
ctx.drawImage(canvas3, 0, 0);    // draw canvas 3 into main canvas

var dataUri = canvasMain.toDataURL(); //extract main canvas as url

---

希望这有帮助

可能的重复是否有一个原因使您不希望一个画布包含同一图像的多个片段？