`; // Add Data Sources table let tableHtml = `

Data Sources

`; dashboardData.dataSources.forEach((source, index) => { const rowBg = index % 2 === 0 ? '#ffffff' : '#f7fafc'; tableHtml += ` `; }); tableHtml += `

Source Name	Type	Volume	Last Ingested	Status
${source.name}	${source.type}	${source.volume}	${source.lastIngested}	${source.status}

`; pdfContentDiv.innerHTML += tableHtml; // Add Data Type Distribution section pdfContentDiv.innerHTML += `

Data Type Distribution

`; // Append the temporary div to the body to render it for html2canvas document.body.appendChild(pdfContentDiv); // Use html2canvas to capture the content as an image const canvas = await html2canvas(pdfContentDiv, { scale: 2, // Increase scale for better resolution in PDF useCORS: true, // Required if you have external images/resources logging: false // Disable logging for cleaner console }); // Remove the temporary div document.body.removeChild(pdfContentDiv); const imgData = canvas.toDataURL('image/png'); const pdf = new window.jspdf.jsPDF({ orientation: 'portrait', unit: 'px', format: [canvas.width, canvas.height] // Use canvas dimensions for PDF }); pdf.addImage(imgData, 'PNG', 0, 0, canvas.width, canvas.height); pdf.save('Data_Lake_Dashboard_Report.pdf'); } // --- Event Listeners --- if (dashboardTabBtn) dashboardTabBtn.onclick = function() { switchTab('dashboard'); }; if (dataConfigTabBtn) dataConfigTabBtn.onclick = function() { switchTab('dataConfig'); }; if (saveConfigBtn) saveConfigBtn.onclick = saveConfiguration; if (addSourceBtn) addSourceBtn.onclick = addDataSource; if (nextBtn) nextBtn.onclick = navigateNext; if (prevBtn) prevBtn.onclick = navigatePrevious; if (downloadPdfBtn) downloadPdfBtn.onclick = downloadPDF; // --- Initial Render --- renderDashboard(); // Render dashboard on initial load switchTab('dashboard'); // Ensure dashboard tab is active by default });