Risk-Based Investment Allocation Tool

Risk-Based Investment Allocation Tool

Discover your ideal asset allocation based on your risk tolerance.

${result.name}

${result.desc}

`; const tableContainer = document.getElementById('allocation-table'); let tableHtml = `
`; const colors = ['#4f46e5', '#a5b4fc', '#d1d5db']; // Indigo, Light Indigo, Gray let colorIndex = 0; for (const [asset, percentage] of Object.entries(result.allocation)) { tableHtml += `
${asset}
${percentage}%
`; } tableHtml += `
`; tableContainer.innerHTML = tableHtml; const ctx = document.getElementById('allocation-chart').getContext('2d'); if (allocationChart) allocationChart.destroy(); allocationChart = new Chart(ctx, { type: 'doughnut', data: { labels: Object.keys(result.allocation), datasets: [{ data: Object.values(result.allocation), backgroundColor: colors, borderColor: '#f9fafb', borderWidth: 4, hoverOffset: 8 }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false } }, cutout: '65%' } }); pdfButtonContainer.classList.remove('hidden'); } /** * Handles PDF Download */ async function handlePdfDownload() { if (!lastResult) return; const { jsPDF } = window.jspdf; // 1. Populate the hidden PDF template document.getElementById('pdf-report-date').textContent = `Generated: ${new Date().toLocaleDateString()}`; document.getElementById('pdf-profile-name').textContent = lastResult.name; document.getElementById('pdf-profile-desc').textContent = lastResult.desc; const chartImgData = allocationChart.toBase64Image(); document.getElementById('pdf-chart-container').innerHTML = ``; let tableHtml = ` `; for (const [asset, percentage] of Object.entries(lastResult.allocation)) { tableHtml += ``; } tableHtml += `
Asset Class Percentage
${asset} ${percentage}%
`; document.getElementById('pdf-table-container').innerHTML = tableHtml; try { // 2. Render the populated template to a canvas const canvas = await html2canvas(document.getElementById('pdf-content'), { scale: 2, useCORS: true }); // 3. Create PDF and add the canvas image const imgData = canvas.toDataURL('image/png'); const pdf = new jsPDF({ orientation: 'portrait', unit: 'pt', format: 'a4' }); const pdfWidth = pdf.internal.pageSize.getWidth(); const imgProps = pdf.getImageProperties(imgData); const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width; pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight); pdf.save('Investment_Allocation_Plan.pdf'); } catch (error) { console.error("Failed to generate PDF:", error); alert("An error occurred while generating the PDF. Please try again."); } finally { // Clean up document.getElementById('pdf-chart-container').innerHTML = ''; document.getElementById('pdf-table-container').innerHTML = ''; } } // --- Event Listeners --- tabs.forEach((tab, index) => { tab.btn.addEventListener('click', () => switchTab(index)); }); prevBtn.addEventListener('click', () => switchTab(currentTab - 1)); nextBtn.addEventListener('click', () => switchTab(currentTab + 1)); calculateBtn.addEventListener('click', calculateAllocation); downloadPdfBtn.addEventListener('click', handlePdfDownload); // --- Initialization --- renderQuestionnaire(); updateNavButtons(); });
Scroll to Top