Untitled
unknown
plain_text
2 years ago
2.1 kB
5
Indexable
// Import required libraries import jsPDF from 'jspdf'; import html2canvas from 'html2canvas'; // Define function to convert HTML to PDF async function convertHtmlToPdf(htmlElements, options = {}) { // Create a new PDF document const pdf = new jsPDF(options.orientation || 'portrait', options.unit || 'mm', options.format || 'a4'); const pageHeight = pdf.internal.pageSize.height - 10; let currentPage = 1; let lastYPos = 10; for (const element of htmlElements) { // Use HTML2Canvas to create an image of the element const canvas = await html2canvas(element); // Calculate the height of the element and how many pages it will span const elementHeight = canvas.height * 72 / 96; // Convert px to pt let numPages = Math.ceil(elementHeight / pageHeight); // Adjust the page height based on the remaining height of the element let remainingHeight = elementHeight; while (numPages > 1 && (currentPage + numPages - 1) * pageHeight > lastYPos + remainingHeight) { numPages--; } const pageHeightAdjusted = remainingHeight / numPages; // Add the element to the PDF document, splitting it into multiple pages if necessary let yPos = lastYPos; for (let i = 0; i < numPages; i++) { if (lastYPos + pageHeightAdjusted > currentPage * pageHeight) { pdf.addPage(); currentPage++; yPos = 10; } const height = Math.min(pageHeightAdjusted, (currentPage * pageHeight) - lastYPos - 10); const imgData = canvas.toDataURL('image/png'); pdf.addImage(imgData, 'PNG', 10, yPos, pdf.internal.pageSize.width - 20, height); remainingHeight -= height; yPos += height + 10; lastYPos = yPos; } } // Save the PDF document pdf.save(options.filename || 'converted.pdf'); } // Call the function with an array of HTML elements const htmlElements = [document.getElementById('div1'), document.getElementById('div2'), document.getElementById('div3')]; convertHtmlToPdf(htmlElements, { orientation: 'portrait', unit: 'mm', format: 'a4', filename: 'converted.pdf' });
Editor is loading...