Подтвердить что ты не робот

Сохранить много элементов холста как изображение

У меня есть 3 слоя холста - 1 - матрица, 2 и 3 - графика, как сохранить их на одном изображении?

<div style="position: relative;">
 <canvas id="matix" width="100" height="100" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
 <canvas id="layer1" width="100" height="100" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
 <canvas id="layer2" width="100" height="100" 
   style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
</div>
4b9b3361

Ответ 1

Вы можете нарисовать один холст в другой с помощью ctx.drawImage(other_canvas,0,0)

Если вы сделаете это в правильном порядке, у вас будет все содержимое холста правильно слоем в одном из них.

Если вы хотите сохранить изображение, вы можете вызвать canvas.toDataURL(), чтобы получить содержимое в формате PNG с кодировкой base64.