Eu tenho um CANVAS no qual coloco uma imagem de fundo e em cima dessa image faço alguns desenhos. Depois preciso transformar esse CANVAS em uma imagem, usei os comandos abaixo para fazer a copia mas a imagem de fundo não é copiada. Tem alguma forma de arrumar isso ??
Grato pela ajuda.
<div id="imagens">
<canvas id="canvas" class="ml-5 mt-2" runat="server" width="650" height="650" style="border: 1px solid black; background-size: contain; background-repeat: no-repeat;"></canvas>
</div>
<img id="imagem" width="650" height="650" />
Estou usando esse script para fazer a copia
<script>var data = canvas.toDataURL();
imagem.setAttribute('src', data);</script>
Código sugerido pelo Japôncio..
var Img = new Image();
Img.src = "url('http://www.digiplay.net.br/imagens/modelo2.jpg')";
$0.getContext('2d').drawImage(Img, 0, 0, 650, 650); <== erro nesta linha
$0.src = canvas.toDataURL('image/png', 1);
imagem.setAttribute('src', $0);