jsPDF is not rendering SVG images right

Question

I am trying to take a screenshot of a webpage using jsPDF which have dynamically created SVGs but it is not rendering the SVG diagrams correctly.

Here is what I have done:

 function genPDF() {
   html2canvas(document.getElementById("full_page"), {
     onrendered: function(canvas) {
       var imgData = canvas.toDataURL("image/png");
       var pdf     = new jsPDF("p", "mm", "a4");
       var width   = pdf.internal.pageSize.width;
       var height  = pdf.internal.pageSize.height;
       
       pdf.addImage(imgData, 'svg', 0, 0, width, height);
       pdf.save('full_report.pdf');
     }
   });
 }

Here full_page is the whole section of the page. How can I get the SVG correctly?

Answer 1

try that:

pdf.addImage(imgData, 'png', 0, 0, width, height);

Your image is an "image/png":

var imgData = canvas.toDataURL('image/png');