Solve the problem of too many pictures and incomplete screenshots HTML2Canvas Dom-to-Image JSPDF

First of all, there are many demo pictures that I need to take screenshots of. When I use HTML2Canvas to transfer, there is always a part left uncut. I searched for several solutions on the Internet, but none of them was solved, so I was speechless. By the way, do you have the function to convert pages to PDF? If you don’t convert images to canvas, you will directly generate DOM elements and styles into PDF editable and non-page-dependent

export const downloadPDF = async (ele) => { var element = window.document.querySelector(ele); // The DOM element is the DIV container to export the PDF to console.log(element); if (! element) return; const resp = await domtoimage.toPng(element); let contentWidth = element.clientWidth; let contentHeight = element.clientHeight; // Set the size of the PDF, 1pt/1px = 0.75 pt = (px/scale)* 0.75 // 2 var pdfX = ((contentWidth + 10) / 2) * 0.75; Var pdfY = ((contentHeight + 500) / 2) * 0.75; Img = pt var imgX = pdfX; img = pt var imgX = pdfX; Var imgY = (contentHeight / 2) * 0.75; Var PDF = new jsPDF("p", "pt", [pdfX, pdfY]); var PDF = new jsPDF("p", "pt", [pdfX, pdfY]); AddImage (resp, "jpeg", 0,0, imgX, imgY); addImage(resp, "jpeg", 0,0, imgX, imgY); pdf.save(`1111f`); };

paging

export const downloadPDF = async (ele) => { var element = window.document.querySelector(ele); // The DOM element is the DIV container to export the PDF to console.log(element); if (! element) return; const resp = await domtoimage.toPng(element); let contentWidth = element.clientWidth; let contentHeight = element.clientHeight; Let pageHeight = (contentWidth / 592.28) * 84.89; // let leftHeight = contentHeight; // page offset let position = 0; // let imgWidth = 595.28; // let imgWidth = 595.28; Let imghEight = (592.28 / contentWidth) * contentHeight; let pdf = new jsPDF("", "pt", "a4"); // There are two heights to distinguish, one is the actual height of the HTML page, and the height of the generated PDF page (841.89) // When the content does not exceed the size of the PDF page, If (leftHeight < pageHeight) {PDF. AddImage (resp, "JPEG", 0, 0, imgWidth, imgEight); } else { while (leftHeight > 0) { pdf.addImage(resp, "JPEG", 0, position, imgWidth, imgHeight); leftHeight -= pageHeight; The position - = 841.89; If (leftHeight > 0) {pdf.addPage(); } } } pdf.save('content.pdf'); };