jsPDF How to set images to fit with various page size (height & width) to a single PDF file

I have multiple types of data images of different sizes (height & width) that need to be converted to PDF using jspdf,html2canvas but I have trouble when I download pdf its works for small name user data but when I get a big name or other data then in right side it's got increase and go out of the page like distorted it's working if the user name is small and less data but when data get its go out of the page from X side I tried scrollX: 0 and scrollX: -window.scrollX both but not getting in proper see the image below the right top data number getting out . ?

export const pdfDownloadHandler = (name, div, user) => {    const input = document.getElementById(div);    var clientHeight = input.clientHeight;    var clientWidth = input.clientWidth;      html2canvas(input,{      scrollX: 0,      scrollY: 0,    }).then((canvas) => {      const imgData = canvas.toDataURL('image/jpeg');      const pdf = new jsPDF('p', 'px', [clientWidth, clientHeight]);      console.log('@PDF: ', pdf, user);      var width = pdf.internal.pageSize.getWidth();      var height = pdf.internal.pageSize.getHeight();        function loadImage(url) {        return new Promise((resolve) => {          let img = new Image();          img.onload = () => resolve(img);          img.src = url;        })      }          pdf.addImage(imgData, 'jpeg', 0, 0, width, height);      pdf.text(`Reviewed By Analyst : ${user} on ${new Date().toLocaleString()}`, 450, 35);      pdf.setFontSize(16);      pdf.text("Powered By ", width - 500, height - 20)      loadImage(solytics).then((logo1) => {        pdf.addImage(logo1, "png", width - 425, height - 35, 90, 25);        });        loadImage(banklogo).then((logo) => {        pdf.addImage(logo, "png", 15, 0, 85, 55);          pdf.save(`${name}.pdf`);        });        });  };  

https://stackoverflow.com/questions/66558187/jspdf-how-to-set-images-to-fit-with-various-page-size-height-width-to-a-sing March 10, 2021 at 12:02PM