Add Jspdf image

Question

I have this script that generates a pdf of a div. Bad images that contain in div are not generated in the pdf, someone can help me?

$('#downloadpdf').click(function() 
                {
                    var doc = new jsPDF('landscape', 'pt', 'a4');
                        doc.addHTML($('#dowextrato'), function()
                    {
                        doc.save("relatorio-<?php echo $Pnome; ?>.pdf");
                    }); 
                });

Answer 1

Para React:

Create a HTMLImageElement and use it as a function parameter doc.addImage

import autoTable  from 'jspdf-autotable'
import jsPDF from 'jspdf'

const image = document.createElement('img')
image.setAttribute('src', '/assets/images/imagem.png')

const gerarPDF = () => {
  const doc = new jsPDF()
  autoTable(doc, {
    margin: {top: 40},  //"empurra" a tabela para baixo, deixando espaco para imagem
    head: cabecalho,
    body: dados,
    didDrawPage: data => {
      doc.addImage(image, 'PNG', data.settings.margin.left, 15, 60, 20)
    }
  })
  doc.save('nomeDoArquivo')
}

Answer 2

Told you to add the parameter:

doc.addImage(imgData, 'JPEG', 15, 40, 180, 160) 

On the site of the plugin there is an example with images.

https://parall.ax/products/jspdf

In this demo there is an example with image in a div.

https://codepen.io/bennettfeely/pen/RWMObL