How to reduce the size of pdf in jspdf document

Question

I am using jspdf for converting html to pdf by following code.

html2canvas(document.getElementById("page4")).then(
                            function(canvas) {
                                document.body.appendChild(canvas);
                                var context = canvas.getContext("2d");
                                var imgData4 = canvas.toDataURL("image/jpeg");
                                var doc = new jsPDF(options, "", "", "");
                                doc.addPage();
                                doc.addImage(imgData4, 'jpeg', 0, 0);
                                doc.save(enrId + ".pdf");
                            });

First im converting html to jpeg. I have 4 pages so each page is separate jpeg

Then i have assigned every page into pdf page like that, im converting html to pdf.

I dont facing any problem here, but memory is a problem here

Here my problem is,

pdf size is around 1.5MB to 2MB. How can i reduce the pdf size?

If it is not possible, Suggest some other plugin for convert html to pdf

Answer 1

I've got the same problem using PNG, now I'm usig JPEG format, and the file size went from 6000 ko to 300 ko.

Try this code :

canvas.toDataURL( 'image/jpeg', 1.0 );

to vary the quality :

var fullQuality = canvas.toDataURL('image/jpeg', 1.0);
var mediumQuality = canvas.toDataURL('image/jpeg', 0.5);
var lowQuality = canvas.toDataURL('image/jpeg', 0.1);

More information in this page :

https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL