html - 如何将两个或三个画布的内容本地复制到另一个画布

Question

我有几层帆布：

<canvas id="layer1" width="700" height="700" class="pageCanvas">   </canvas>
<canvas id="layer2"  width="700" height="700" class="pageCanvas">   </canvas>
<canvas id="layer3"  width="700" height="700" class="pageCanvas">   </canvas>

我想放画布的图像

第 1 层和第 2 层

画布

第 3 层。

如果您写下代码，我会很高兴，因为我在互联网上找不到任何好的解释。

谢谢``

Answer 1

合并两个画布并将其放到layer3：

var canvas1 = document.getElementById('layer1');

var canvas2 = document.getElementById('layer2');

var canvas3 = document.getElementById('layer3');

canvas3.drawImage(canvas1, 0, 0);

canvas3.drawImage(canvas2, 0, 0);