Data Visualization Project Planner

Formulating the Brief

Working with Data

Establishing the Story

Developing the Design

Project Plan Summary

Key Variables: ${data.variables || 'N/A'}

Quality Notes: ${data.quality || 'N/A'}

3. The Story

Angle/Narrative: ${data.angle || 'N/A'}

Framing (Inclusions/Exclusions): ${data.framing || 'N/A'}

Focus/Highlights: ${data.focus || 'N/A'}

4. The Design

Proposed Charts: ${data.charts || 'N/A'}

Interactivity Needs: ${data.interactivity || 'N/A'}

Annotations: ${data.annotations || 'N/A'}

`; } // Event Listeners nextBtn.addEventListener('click', () => changeTab(1)); prevBtn.addEventListener('click', () => changeTab(-1)); tabs.forEach(tab => { tab.addEventListener('click', () => { currentTab = parseInt(tab.dataset.tab); if (currentTab === totalTabs) { generateSummary(); } updateTabs(); }); }); downloadBtn.addEventListener('click', async () => { const originalButtonText = downloadBtn.textContent; downloadBtn.textContent = 'Generating...'; downloadBtn.disabled = true; const summaryElement = document.getElementById('summary-content'); if (!summaryElement) { alert('No summary to download.'); downloadBtn.textContent = originalButtonText; downloadBtn.disabled = false; return; } const canvas = await html2canvas(summaryElement, { scale: 2 }); const imgData = canvas.toDataURL('image/png'); const { jsPDF } = window.jspdf; const pdf = new jsPDF('p', 'mm', 'a4'); const pdfWidth = pdf.internal.pageSize.getWidth(); const pdfHeight = (canvas.height * pdfWidth) / canvas.width; pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight); pdf.save('Data_Visualization_Plan.pdf'); downloadBtn.textContent = originalButtonText; downloadBtn.disabled = false; }); // Initial state updateTabs(); });
Scroll to Top