Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

453
Views
Cómo agregar perfectamente mi imagen en un archivo pdf usando jsPDF sin que la imagen se distorsione

Paso un día y medio tratando de resolver esto. Estoy tratando de obtener una captura de pantalla de toda mi página web y agregarla a un archivo pdf usando jspdf. ¿Cómo puedo alinearlo de manera que se vea de manera similar a como lo hacemos cuando usamos la opción de impresión predeterminada en el navegador? Limpio y ordenado. Sin embargo, en jspdf no entiendo cómo extender mis datos a la página siguiente en pdf también. Esto es lo que he probado:

 function setScreenshot() { html2canvas(document.body).then( function (canvas) { var extra_canvas = document.createElement("canvas"); let height = $('body').height(); let width = $('body').width(); extra_canvas.setAttribute('width', width); extra_canvas.setAttribute('height', height); var ctx = extra_canvas.getContext('2d'); ctx.drawImage(canvas, 0, 0, canvas.width, canvas.height, 0, 0, width, height); var dataURL = extra_canvas.toDataURL(); var img = $(document.createElement('img')); doc = new jsPDF({ unit: 'px', }); let docWidth = doc.internal.pageSize.width let docHeight = doc.internal.pageSize.height let widthRatio = docWidth / canvas.width let heightRatio = docHeight / canvas.height doc.addImage(dataURL, 'JPEG', 0, 0, width, height * heightRatio); doc.save('ExportFile.pdf'); $('#screenShot').attr('download', 'Test file.png'); $('#screenShot')[0].click(); }) }

También he intentado cambiar el tamaño del lienzo al de una hoja A4 como sigue:

 ctx.drawImage(canvas, 0, 0, canvas.width, canvas.height, 0, 0, 793, 1122);

Pero nuevamente, no funciona para dispositivos más pequeños ya que la imagen se estira. Cualquier solución a esto será realmente útil. Gracias chicos. También sugiera si hay un método alternativo o una biblioteca con la que pueda lograr lo mismo.

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!