I'm using a script to save a div in png. Within this div has one, but this image does not appear in the final result after saving. The code I'm using is this
$(function() {
$("#btnSave").click(function() {
html2canvas($(".container-assinatura"), {
onrendered: function(canvas) {
theCanvas = canvas;
document.body.appendChild(canvas);
var photo = canvas.toDataURL('image/png');
//Convert and download as image
Canvas2Image.saveAsPNG(canvas);
// Clean up
document.body.removeChild(canvas);
}
});
});
});
Remembering that this script does not work in Chrome, only in Mozilla, and here in the company where I work, for which I'm developing this, 95% of people use Chrome. Edit: The HTML of my code is this
<div style="color:#000" class="container-assinatura">
<div id="gerador">
<p style="margin-bottom: 0in"></p>
<table class="MsoNormalTable" style="border-collapse:collapse" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr style="height:84.8pt">
<td style="width:154.25pt;border:none;border-right:solid #E36C0A 2.0pt; padding:0cm 5.4pt 0cm 5.4pt;height:84.8pt" valign="top" width="206">
<p class="MsoNormal">
<span style="font-size:16.0pt"><o:p> </o:p></span>
</p>
<p class="MsoNormal">
<div id="logo_position">
<img id="logo_filial" src="png/marca_laranja.png">
<span
style="font-size:9.0pt"><o:p></o:p>
</span>
</div>
</p>
</td>
<td style="width:205.55pt;border:none;padding:0cm 5.4pt 0cm 5.4pt; height:84.8pt" valign="top" width="274">
<p class="MsoNormal">
<b>
<span style="color:#E36C0A"><b>{{nome}}</b></span>
</b>
<b>
<span style="font-size:9.0pt;color:red"></span><br>
</b>
<b>
<span style="font-size:9.0pt;color:gray">{{setor}}<i><br></i></span>
</b>
<span style="font-size:9.0pt;color:gray"><o:p></o:p></span>
</p>
<p class="MsoNormal">
<span style="font-size:9.0pt;color:black"><b>Tel:</b> {{telefone}}<br><b>E-mail:</b> </span>
<span style="font-size:9.0pt">
<a href="mailto:{{email}}">
<span style="color:blue">{{email}}</span>
</a>
<br><span><b>Rocket.Chat:</b> {{rocket}}</span>
<span style="font-size:9.0pt"><o:p></o:p></span>
</span>
</p>
</td>
</tr>
</tbody>
</table>
<p style="margin-bottom: -72px"><o:p> </o:p><font face="Ubuntu
Light"><font size="3"><br>
</font></font><br>
</p>
<div class="moz-signature"> </div>
<p style="margin-bottom: 0in"><br>
</p>
<div class="moz-signature"> </div>
</div>
</div>
<input type="button" id="btnSave" class="btn btn-dark" value="Salvar Assinatura">