| Risk Category | Score (0-100) | Description |
|---|---|---|
| Water Stress Exposure: | ${results.scores.waterStress.toFixed(1)} | Risk from regional water scarcity. |
| Operational Water Risk: | ${results.scores.operational.toFixed(1)} | Risk from direct water use in operations. |
| Supply Chain Water Risk: | ${results.scores.supplyChain.toFixed(1)} | Risk from water intensity in upstream supply chain. |
| Water Quality Impact Risk: | ${results.scores.quality.toFixed(1)} | Risk from potential water pollution/discharge. |
Disclaimer: This tool provides *simulated* water risk assessments for educational and illustrative purposes only. It does not reflect real-world company data or guarantee future outcomes. Real-world water risk analysis is complex and requires detailed, audited data.
`; resultsOutput.innerHTML = tableHtml; } /** * Renders the water risk breakdown chart. * @param {Object} results - Results from analyzeWaterRisk. */ function renderRiskChart(results) { if (!results || !results.scores) { chartPlaceholder.classList.remove('hidden'); if (waterRiskChartInstance) { waterRiskChartInstance.destroy(); waterRiskChartInstance = null; } return; } chartPlaceholder.classList.add('hidden'); // Hide placeholder if chart can be rendered const ctx = document.getElementById('waterRiskChart').getContext('2d'); // Destroy existing chart instance if it exists to prevent overlap if (waterRiskChartInstance) { waterRiskChartInstance.destroy(); } const chartLabels = ['Water Stress Exposure', 'Operational Water Risk', 'Supply Chain Water Risk', 'Water Quality Impact Risk']; const chartData = [ results.scores.waterStress, results.scores.operational, results.scores.supplyChain, results.scores.quality ]; const chartColors = ['#60A5FA', '#34D399', '#FCD34D', '#EF4444']; // Blue, Green, Yellow, Red waterRiskChartInstance = new Chart(ctx, { type: 'bar', data: { labels: chartLabels, datasets: [{ label: 'Risk Score (0-100)', data: chartData, backgroundColor: chartColors, borderColor: chartColors.map(color => color.replace('0.2', '1')), // Darker border borderWidth: 1 }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false // Legend is not necessary for single dataset bar chart if label is clear }, title: { display: true, text: 'Breakdown of Water Risk by Category', font: { size: 18, family: 'Inter', weight: 'bold' }, color: '#1F2937' }, tooltip: { callbacks: { label: function(context) { return `${context.label}: ${context.parsed.y.toFixed(1)} / 100`; } } } }, scales: { y: { beginAtZero: true, max: 100, title: { display: true, text: 'Risk Score (0-100)', font: { size: 14, family: 'Inter' }, color: '#333' }, ticks: { font: { family: 'Inter' } } }, x: { ticks: { font: { family: 'Inter' } } } } } }); } /** * Handles the PDF download functionality. * Captures the results output and chart canvases to generate a PDF report. */ window.downloadPdf = async function() { if (typeof html2canvas === 'undefined' || typeof jspdf === 'undefined' || typeof jspdf.jsPDF === 'undefined') { displayMessage('PDF generation libraries not loaded. Please try again or refresh.'); return; } hideMessage(); const { jsPDF } = jspdf; const doc = new jsPDF('p', 'pt', 'a4'); const elementsToCapture = [ document.getElementById('resultsOutput'), document.getElementById('waterRiskChart') ]; let yPos = 40; doc.setFontSize(22); doc.setTextColor(51, 51, 51); doc.text('Water Risk Exposure Analysis Report', doc.internal.pageSize.getWidth() / 2, yPos, { align: 'center' }); yPos += 30; doc.setFontSize(12); doc.setTextColor(100, 100, 100); doc.text(`Generated on: ${new Date().toLocaleDateString()}`, doc.internal.pageSize.getWidth() / 2, yPos, { align: 'center' }); yPos += 40; for (const element of elementsToCapture) { try { const wasHidden = element.classList.contains('hidden'); if (wasHidden) { element.classList.remove('hidden'); } // For charts, ensure they are rendered before capturing if (element.id === 'waterRiskChart' && waterRiskChartInstance === null) { console.warn("Chart not yet rendered for PDF capture. Skipping chart section."); if (wasHidden) { element.classList.add('hidden'); } continue; } const canvas = await html2canvas(element, { scale: 2, // Increase scale for better resolution in PDF useCORS: true, // Required for images/fonts loaded from other origins if any backgroundColor: '#ffffff' }); if (wasHidden) { element.classList.add('hidden'); } const imgData = canvas.toDataURL('image/png'); const imgWidth = 550; // Desired width for image in PDF const imgHeight = (canvas.height * imgWidth) / canvas.width; if (yPos + imgHeight > doc.internal.pageSize.getHeight() - 40) { doc.addPage(); yPos = 40; } doc.addImage(imgData, 'PNG', (doc.internal.pageSize.getWidth() - imgWidth) / 2, yPos, imgWidth, imgHeight); yPos += imgHeight + 30; } catch (error) { console.error('Error capturing element for PDF:', error); displayMessage('Failed to generate part of the PDF. Please ensure all data is loaded and visible before downloading.'); } } doc.save('Water_Risk_Analysis_Report.pdf'); }; // Initial setup: Show the input tab and update navigation buttons when the DOM is ready showTab('input'); });