Rental Property Utility Cost Estimator

Rental Property Utility Cost Estimator

Estimate monthly utility costs for a rental property.

Your utility cost estimate will appear here. Please fill out the 'Data Configuration' tab first.

Property Details

Local Utility Rates (Monthly)

${formatCurrency(results.totalCost)}

Cost Breakdown

${breakdownHtml}
`; downloadBtn.classList.remove('hidden'); const ctx = document.getElementById('costChart')?.getContext('2d'); if(ctx) { if (costChart) costChart.destroy(); costChart = new Chart(ctx, { type: 'doughnut', data: { labels: Object.keys(results.breakdown), datasets: [{ data: Object.values(results.breakdown), backgroundColor: ['#0891b2', '#f59e0b', '#4f46e5', '#6b7280'], borderColor: '#ffffff', borderWidth: 3 }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'bottom' }, tooltip: { callbacks: { label: (c) => `${c.label}: ${formatCurrency(c.raw)}` } } } } }); } } function downloadPDF() { const { jsPDF } = window.jspdf; const pdf = new jsPDF({ orientation: 'p', unit: 'mm', format: 'a4' }); const contentToPrint = document.getElementById('dashboard-content'); if (!contentToPrint) return; html2canvas(contentToPrint, { scale: 2, useCORS: true, onclone: (doc) => { const chartCanvas = doc.getElementById('costChart'); if (chartCanvas && costChart) { const img = new Image(); img.src = costChart.toBase64Image(); img.style.maxWidth = '100%'; img.style.height = 'auto'; chartCanvas.parentNode.replaceChild(img, chartCanvas); } } }).then(canvas => { const imgData = canvas.toDataURL('image/png'); const pdfWidth = pdf.internal.pageSize.getWidth(); const pdfHeight = (canvas.height * pdfWidth) / canvas.width; pdf.addImage(imgData, 'PNG', 10, 10, pdfWidth - 20, pdfHeight > 277 ? 277 : pdfHeight - 20); pdf.save('Rental-Utility-Estimate.pdf'); }); }
Scroll to Top