Jspdf (imgage to pdf) not converting whole image to pdf

Question

var pdff ;
function encodeImageFileAsURL(element) {
  var file = element.files[0];
  var reader = new FileReader();
  reader.onloadend = function() {
    console.log(reader.result)
    pdff = reader.result;
    pdf();
  }
  reader.readAsDataURL(file);
}
function pdf() {
    var doc = new jsPDF();
var img = new Image();
img.src = pdff;
var width = doc.internal.pageSize.getWidth;
var height = doc.internal.pageSize.getHeight;



 doc.addImage(img, 'JPG', 0, 0, width, height);
    doc.save('imkk.pdf'); // downloads pdf 
}

This is the code I am using currently to convert image to base64 string and then to pdf, it works with small images but I need to make a pdf in which the image is large it makes the pdf but only with a portion of image here is the image link that I want in pdf :- https://drive.google.com/file/d/1X3G3gGsTUKvAtBh78iHMh_G4oy2-O73D/

Answer 1

// You need to make your image into a Data URL and declare page size

var imgData = 'data:image/jpeg;base64,/9j/.............../an/9k='
var width = 8.33
var height = 125

var doc = new jsPDF({ unit: 'in', format: [width, height],})
doc.addImage(imgData, 'JPG', 0, 0, width, height)
doc.save('imkk.pdf')

The default will just be the start of image on the page, by declaring page width and height that one page can be whatever the URL length limit is for that environment, so note it can often be 1.5 MB.