I have problems when printing a div that contains an image in base64 (it is visible in the html, but when printing with printArea.js the image remains white)
the button executes this function
function imprimirArea(area) {
$(area).printArea();
}
And the area I want to print is this fiddle :
<div style="display:inline;" id="divtablaPrint_v1">
<style type="text/css">
.tg {border-collapse:collapse;border-spacing:0;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;}
.tg .tg-baqh{text-align:center;vertical-align:top}
.tg .tg-yw4l{vertical-align:top}
.tg .tg-amwm{font-weight:bold;text-align:center;vertical-align:top}
</style>
<!-- <a href="#" id="imprime" onclick="window.print();"> <i class="fa fa-print fa-2">Imprimir</i> </a>-->
<table id="tablaPrint" class="tg" style="min-height: 500px"><tbody><tr style="border:solid;"> <th class="tg-yw4l" colspan="1"><center><img src="../../../temporalsalvajina/public/img/logoau.png" width="60px"></center> </th><th class="tg-yw4l" colspan="3" aling="center">Suarez cauca <br> 3108798863 <br> [email protected]</th> <th class="tg-yw4l" colspan="2"><center><b>SALVAJINA MOTOS </b><br> Repuestos - Taller autorizado <br> Nit: 345020363-3 Regimen común</center></th> </tr> <tr><th class="tg-yw4l" colspan="3"><center> Factura de venta No. P-1182</center></th><th class="tg-yw4l" colspan="3"><center> Fecha: 2018-12-05 10:02:27.00</center></th></tr><tr style="border:solid;"> <th class="tg-yw4l" colspan="3"> Cliente: salvajina motos - I.D: 34.502.036-3 </th><th class="tg-yw4l" colspan="3"> Atiende: MORALES SALVAJINA </th></tr> <tr style="border:solid;"> <th class="tg-amwm">Referencia<br> </th><th class="tg-amwm">Descrip.<br> </th><th class="tg-amwm">Precio base<br> </th><th class="tg-amwm">Cant. </th><th class="tg-amwm">Total c/u </th><th class="tg-amwm">Sub Total </th></tr> </tbody> <tr style="border-width:0 1px;"> <td style="border-width:0 1px;"><font size="1px">10015047**36-1522-03</font></td> <td style="border-width:0 1px;"><font size="1px">PASTA DE BANDA DE F</font></td> <td style="border-width:0 1px;"><font size="1px">8,364.00</font></td> <td style="border-width:0 1px;"><font size="1px">3</font></td> <td style="border-width:0 1px;"><font size="1px">9,953.16</font></td> <td style="border-width:0 1px;"><font size="1px">29,859.48 </font></td> </tr><tr style="border-width:0 1px;"><td style="border-width:0 1px;"><h4 style="color:white"> </h4></td><td style="border-width:0 1px;"><h4 style="color:white"> </h4></td><td style="border-width:0 1px;"><h4 style="color:white"> </h4></td> <td style="border-width:0 1px;"><h4 style="color:white"> </h4></td> <td style="border-width:0 1px;"><h4 style="color:white"> </h4></td> <td style="border-width:0 1px;"><h4 style="color:white"> </h4></td></tr><tr style="border-width:0 1px;"><td style="border-width:0 1px;"><h4 style="color:white"> </h4></td><td style="border-width:0 1px;"><h4 style="color:white"> </h4></td><td style="border-width:0 1px;"><h4 style="color:white"> </h4></td> <td style="border-width:0 1px;"><h4 style="color:white"> </h4></td> <td style="border-width:0 1px;"><h4 style="color:white"> </h4></td> <td style="border-width:0 1px;"><h4 style="color:white"> </h4></td></tr> <tr> <td class="tg-yw4l" colspan="4"><center> <center></center></center></td><td class="tg-amwm">IVA</td><td class="tg-baqh">4,767.48</td></tr><tr style="border:solid;"> <td class="tg-yw4l" colspan="4"><center>
<table>
<tbody><tr>
<td>
<div id="imgQR" title=""><canvas width="200" height="200" style="display: none;"></canvas><img alt="Scan me!" style="display: block;" src="data:image/png;base64,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"></div>
</td>
<td>
NumFac: P1182 <br>
FecFac: 20140319105605 <br>
NitFac: 900373076 <br>
DocAdq: <br>
ValFac: 20320910.9 <br>
ValIva: 20320910.9 <br>
CUFE: da39a3ee5e6b4b0d3255bfef95601890afd80709
</td>
</tr><tr>
</tr></tbody></table>
<center></center></center></td><td class="tg-amwm">TOTAL</td><td class="tg-baqh">29,859.48</td></tr></table>
</div>
the photo that is url to an image on the server work normal and looks good when using the printArea.js, but the image (qr) that is by base64 goes blank.