1

Tengo problemas al imprimir un div que contiene una imagen en base64 (es visible en el html, pero al dar imprimir con printArea.js la imagen queda blanca)

el boton ejecuta esta funcion

function imprimirArea(area) {
   $(area).printArea();
 }

Y el area que deseo imprimir es esta 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">&nbsp;&nbsp;&nbsp;</h4></td><td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td><td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td> <td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td> <td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td>  <td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td></tr><tr style="border-width:0 1px;"><td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td><td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td><td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td> <td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td> <td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</h4></td>  <td style="border-width:0 1px;"><h4 style="color:white">&nbsp;&nbsp;&nbsp;</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>

la foto que esta por url a una imagen en el servidor funcionar normal y se ve bien al usar el printArea.js, pero la imagen (qr) que esta por base64 sale en blanco.

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.