Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

125
Vistas
jspdf version 1.4 .html() img inside canvas is full size instead of styled width/height

So after searching I haven't found specific answer to my issue.

I'm using the new JSPDF version that uses .html(element, options) format... which uses html2canvas/dompurifier built in, so I don't have to pass an html2canvas and .addImage(canvas) to get it to pdf...

I'm passing a "container" div into jspdf, and it is rendering, but I have an image element within the container div. on my life page, it is sized to fit within it's wrapping div element, however in the pdf, it's full size and is running off the size of the page. Elements after the img tag are on the next line and are showing appropriately.

container div, planning on having the printoutHeader be on top of every page of PDF

<style>  #mainLogo img {
    height: auto;
    width: 100%;
    max-width: 100px;
  }</style>
    <div class="printOut page1">
      <div class="printoutHeader ui huge top fixed menu borderless">
        <div class="item" id="mainLogo">
          <img src=''> <!-- I have the img base64 Encoded here -->
        </div>

        <div class="item">
          <div class="item headerDetails">
          Generic Header Information here
          </div>
        </div>

JS Executed:

function export_to_pdf(element) {
  var pdf = new jsPDF();
  pdf.html(element, {
    autoPaging: 'text',
    callback: function(pdf) {
      var iframe = document.createElement('iframe');
      iframe.setAttribute('style', 'position:absolute;right:0; top:0; bottom:0; height:100%; width:500px');
      document.body.appendChild(iframe);
      iframe.src = pdf.output('datauristring');
    }
  });
}

export_to_pdf(document.getElementsByClassName('printOut')[0]);

Hope is that I could eventually run something like a forEach of the elements, have them add a page to PDF, save PDF from there.

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda