31:T434,Plot.plot({ marginLeft: 60, color: { legend: true }, x: { label: "Year", ticks: [2025, 2030, 2035, 2040, 2045, 2050, 2055], tickFormat: "" }, y: { label: "$", grid: true }, marks: [ Plot.ruleY([0]), Plot.barY(longTable, { x: (d) => d.yearIndex + this_year, y: (d) => +d.value / 12, fill: (d) => d.variable, title: (d) => `${d.yearIndex + this_year}: ${d3.format("$,.2s")(+d.value / 12)}`, tip: true }), // Add text labels at the top every 5 years Plot.text( d3 .groups(longTable, (d) => d.yearIndex) .map(([yearIndex, values]) => { const total = d3.sum(values, (v) => +v.value / 12); return { year: yearIndex + this_year, total }; }) .filter((d) => (d.year % 5 === 0) | (d.year === 2034)), // only every 5 years { x: "year", y: "total", text: (d) => d3.format("$,.3s")(d.total), dy: -7, // nudge label above bar fill: "black" } ) ] })32:T434,Plot.plot({ x: { label: "Year", tickFormat: "" }, y: { label: "%", grid: true }, marks: [ Plot.ruleY([0]), Plot.line(newTable, { x: (d) => d.yearIndex + this_year, y: (d) => +d.effectiveRateOnLoan * 100, title: (d) => `New place: ${d.yearIndex + 2021}: ${d3.format(".2%")( d.effectiveRateOnLoan )}`, stroke: "green", tip: true }), Plot.line(mortgageTable, { x: (d) => d.yearIndex + this_year, y: (d) => +d.effectiveRateOnLoan * 100, title: (d) => `Status quo: ${d.yearIndex + 2021}: ${d3.format(".2%")( d.effectiveRateOnLoan )}`, stroke: "blue", strokeWidth: 2, tip: true }), Plot.line(combinedTable, { x: (d) => d.yearIndex + this_year, y: (d) => (+d.yearlyCost / mortgage_principal) * 100, title: (d) => `Home equity loan: ${d.yearIndex + this_year}: ${d3.format(".2%")( +d.yearlyCost / mortgage_principal )}`, tip: true, stroke: "red" }) ] })33:T479,Plot.plot({ marginLeft: 60, x: { label: "Year", tickFormat: "" }, y: { label: "%", grid: true }, marks: [ Plot.ruleY([0]), Plot.line(combinedTable, { x: (d) => d.yearIndex + this_year, y: (d) => +d.cumulativeYearlyCost, title: (d) => `Home equity loan: ${d.yearIndex + this_year}: ${d3.format("$,.0f")( +d.cumulativeYearlyCost )}`, tip: true, stroke: "red" }), Plot.line(mortgageTable, { x: (d) => d.yearIndex + this_year, y: (d) => +d.cumulativeEffectiveRate * mortgage_principal, stroke: "blue", title: (d) => `Status quo: ${d.yearIndex + this_year}: ${d3.format("$,.0f")( d.cumulativeEffectiveRate * mortgage_principal )}`, tip: true }), Plot.line(newTable, { x: (d) => d.yearIndex + this_year, y: (d) => +d.cumulativeEffectiveRate * mortgage_principal, stroke: "green", title: (d) => `New place: ${d.yearIndex + this_year}: ${d3.format("$,.0f")( d.cumulativeEffectiveRate * mortgage_principal )}`, tip: true }) ] })34:T42a,Plot.plot({ marginLeft: 60, color: { legend: true }, x: { label: "Year", ticks: [2025, 2030, 2035, 2040, 2045, 2050, 2055], tickFormat: "" }, y: { label: "$", grid: true }, marks: [ Plot.ruleY([0]), Plot.barY(newMonthlyTable, { x: (d) => d.yearIndex + this_year, y: (d) => +d.value / 12, fill: (d) => d.variable, title: (d) => `${d.yearIndex + this_year}: ${d3.format("$,.2s")(+d.value / 12)}`, tip: true }), // Add text labels at the top every 5 years Plot.text( d3 .groups(newMonthlyTable, (d) => d.yearIndex) .map(([yearIndex, values]) => { const total = d3.sum(values, (v) => +v.value / 12); return { year: yearIndex + this_year, total }; }) .filter((d) => d.year % 5 === 0), // only every 5 years { x: "year", y: "total", text: (d) => d3.format("$,.3s")(d.total), dy: -7, // nudge label above bar fill: "black" } ) ] })35:T90e,function amortizationTable( principal, annualRate, years, // loan term in years propertyValue, propertyTaxRate, growthRate, yearsSincePurchase // years since purchase ) { // Ensure annualRate is decimal if (annualRate > 1) annualRate = annualRate / 100; const monthlyRate = annualRate / 12; const months = years * 12; const monthlyPayment = months > 0 ? monthlyRate === 0 ? principal / months : (principal * monthlyRate) / (1 - Math.pow(1 + monthlyRate, -months)) : 0; const table = []; let balance = principal; let cumulativeCost = 0; // Project from purchase year (-yearsSincePurchase) to 30 years from today const startIndex = -yearsSincePurchase; const endIndex = 30; for (let yearIndex = startIndex; yearIndex <= endIndex; yearIndex++) { let interestPaid = 0; let principalPaid = 0; const startBalance = balance; const elapsedYears = yearIndex + yearsSincePurchase; // Determine loan amount for this year const loanAmount = elapsedYears >= 0 && elapsedYears < years ? principal : 0; // Make payments only while loan is active if (elapsedYears >= 0 && elapsedYears < years) { for (let m = 0; m < 12; m++) { const interest = balance * monthlyRate; let principalPay = monthlyPayment - interest; if (principalPay > balance) principalPay = balance; interestPaid += interest; principalPaid += principalPay; balance -= principalPay; } if (balance < 1e-8) balance = 0; } else { interestPaid = 0; principalPaid = 0; if (elapsedYears >= years) balance = 0; } // Property value & tax always project const currentValue = propertyValue * Math.pow(1 + growthRate, elapsedYears); const propertyTax = currentValue * propertyTaxRate; const yearlyCost = interestPaid + propertyTax; cumulativeCost += yearlyCost; table.push({ yearIndex, loanAmount, startBalance, endBalance: balance, interestPaid, principalPaid, propertyValue: currentValue, propertyTax, effectiveRateOnLoan: yearlyCost / principal, effectiveRateOnValue: yearlyCost / currentValue, cumulativeEffectiveRate: cumulativeCost / principal }); } return table; }36:T52c,function combineTables( mainTable, equityTable, mainPrincipal = 0, equityPrincipal = 0 ) { const combined = []; const equityLookup = {}; equityTable.forEach((row) => { equityLookup[row.yearIndex] = row; }); const totalPrincipal = Number(mainPrincipal) + Number(equityPrincipal) || 1; let cumulativeYearlyCost = 0; // NEW: running total of yearly costs mainTable.forEach((main) => { const equity = equityLookup[main.yearIndex] || {}; const interestPaid = Number(main.interestPaid || 0) + Number(equity.interestPaid || 0); const principalPaid = Number(main.principalPaid || 0) + Number(equity.principalPaid || 0); const propertyTax = Number(main.propertyTax || 0) + Number(equity.propertyTax || 0); const loanAmount = Number(main.loanAmount || 0) + Number(equity.loanAmount || 0); const yearlyCost = interestPaid + propertyTax; // Update cumulative cost cumulativeYearlyCost += yearlyCost; // calculate annual effective rates as percentages combined.push({ yearIndex: main.yearIndex, calendarYear: main.calendarYear ?? null, interestPaid, principalPaid, propertyTax, yearlyCost, cumulativeYearlyCost, // NEW: cumulative running total loanAmount }); }); return combined; }37:[] 2f:{"title":"Multiple loan and tax calculator","cells":[{"id":4,"value":"# Multiple loan and tax calculator\n\nWhat's the total cost of owning a home?","pinned":false,"hidden":false,"mode":"md"},{"id":100,"value":"viewof years_ago = Inputs.range([0, 30], {\n value: 4,\n label: \"How many years ago did you buy your house?\",\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":66,"value":"viewof home_cost = Inputs.range([0, 1000000], {\n label: \"How much did you buy your home for?\",\n value: 352000,\n step: 1000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"viewof mortgage_principal = Inputs.range([0, 750000], {\n step: 1000,\n label: \"How much did you borrow to buy your house?\",\n value: home_cost * 0.8\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":71,"value":"*This value is pre-populated with the assumption you made a 20% down payment.*","pinned":false,"hidden":false,"mode":"md"},{"id":15,"value":"viewof mortgage_rate = Inputs.range([0, 10], {\n step: 0.005,\n label: \"What's your interest rate in percent (e.g. 3 is 3%)\",\n value: 3.25\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":40,"value":"viewof mortgage_years = Inputs.range([0, 30], {\n label: \"What is your initial mortgage term in years?\",\n value: 30,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":58,"value":"viewof taxes = Inputs.range([0, 8000], {\n label: \"What were your monthly taxes when you bought the house?\",\n value: 530,\n step: 10\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":110,"value":"*These are your monthly taxes when you bought the house. They've since increased to $610 per month.*","pinned":false,"hidden":false,"mode":"md"},{"id":87,"value":"viewof tax_increase = Inputs.range([0, 10], {\n label: \"How much do you think your taxes will go up each year as a percent?\",\n value: 3.57,\n step: 0.01\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":106,"value":"*This is pre-populated with a value that's pretty close to the average annual increase you've experienced. For a tiny bit of simplicity, we're going to assume that your property value increases at the same percentage rate as your taxes. This only effects the* \"effective rate on value\" *calculation.*\n\n*If you put the correct value in for the taxes when you bought your house, slide the bar above until this figure is very close to your current monthly taxes. Initial taxes of ${d3.format(\"$,.0f\")(taxes)} and a ${d3.format(\".3%\")(tax_increase/100)} annual increase means your current taxes are about **${d3.format(\"$,.0f\")((mortgageTable.find(row => row.yearIndex === 0)?.propertyTax ?? null)/12)}***.","pinned":false,"hidden":false,"mode":"md"},{"id":61,"value":"## Your current picture\n\n* You're currently paying about ${d3.format(\"$,.0f\")(monthly_mortgage_payment + 610)} a month.\n* Your official interest rate is ${mortgage_rate}%, but if you include taxes the effective cost of ownership is a bit more because $610 a a month in taxes ain't nothing.\n* Including taxes, your effective cost as a percentage of the loan you took out is ${d3.format(\".2%\")(mortgageTable.find(row => row.yearIndex === 0)?.effectiveRateOnLoan ?? null)}\n\n\nHere's how your effective ownership rate changes over time. This is the cost of owning your home where the money you pay that you never get back is reflected as an annual percentage cost of your initial loan.\n\nThe denominator here is the value of the loan you took out. Your effective rate keeps going up even after you've paid off your loan because we've modeled taxes to be increasing every year. This is pretty realistic.\n","pinned":false,"hidden":false,"mode":"md"},{"id":237,"value":"#### Effective cost of ownership, based on initial loan amount","pinned":false,"hidden":false,"mode":"md"},{"id":125,"value":"Plot.plot({\n x: {\n label: \"Year\",\n tickFormat: \"\"\n },\n y: {\n label: \"%\",\n grid: true\n },\n marks: [\n Plot.ruleY([0]),\n Plot.line(mortgageTable, {\n x: (d) => d.yearIndex + this_year,\n y: (d) => +d.effectiveRateOnLoan * 100,\n title: (d) =>\n `${d.yearIndex + 2021}: ${d3.format(\".2%\")(d.effectiveRateOnLoan)}`,\n stroke: \"blue\",\n tip: true\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":153,"value":"Percentages are one thing, absolute numbers are another. This chart shows the total amount of money you pay for interest and taxes – in other words, this is how much money you're paying that you'll never see again. \n\nBear in mind that this is just the status quo – this is just your loan as it currently exists, combined with taxes.","pinned":false,"hidden":false,"mode":"md"},{"id":239,"value":"#### Actual cost of ownership","pinned":false,"hidden":false,"mode":"md"},{"id":342,"value":"By 2055, you'll have paid nearly $600k in taxes and interest. ","pinned":false,"hidden":false,"mode":"md"},{"id":148,"value":"Plot.plot({\n marginLeft: 60,\n x: {\n label: \"Year\",\n tickFormat: \"\"\n },\n y: {\n label: \"$\",\n grid: true\n },\n marks: [\n Plot.ruleY([0]),\n Plot.line(mortgageTable, {\n x: (d) => d.yearIndex + this_year,\n y: (d) => +d.cumulativeEffectiveRate * mortgage_principal,\n title: (d) =>\n `${d.yearIndex + this_year}: ${d3.format(\"$,.0f\")(\n d.cumulativeEffectiveRate * mortgage_principal\n )}`,\n tip: true,\n stroke: \"blue\"\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":215,"value":"## Now let's add a home equity loan the mix\n\nAnswer these questions about a possible home equity loan.","pinned":false,"hidden":false,"mode":"md"},{"id":217,"value":"viewof equity_loan = Inputs.range([0, home_cost], {\n value: 142000,\n label: \"How big of a home equity loan would you take out?\",\n step: 1000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":220,"value":"*This is pre-populated with my estimate of the biggest loan a bank would allow you to take out.*","pinned":false,"hidden":false,"mode":"md"},{"id":224,"value":"viewof equity_rate = Inputs.range([0, 15], {\n label: \"What's the interest rate of your home equity loan?\",\n step: 0.005,\n value: 7.88\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":227,"value":"*This is pre-populated with the most competitive rate for a 10-year loan.*","pinned":false,"hidden":false,"mode":"md"},{"id":229,"value":"viewof equity_term = Inputs.range([5, 20], {\n label: \"How many years is the loan for?\",\n value: 10,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":261,"value":"#### Effective rate of ownership, based on your original mortgage","pinned":false,"hidden":false,"mode":"md"},{"id":344,"value":"Getting a home equity loan dramatically increases the amount of money you're paying in interest, especially at the beginning of the loan. ","pinned":false,"hidden":false,"mode":"md"},{"id":241,"value":"Plot.plot({\n x: {\n label: \"Year\",\n tickFormat: \"\"\n },\n y: {\n label: \"%\",\n grid: true\n },\n marks: [\n Plot.ruleY([0]),\n Plot.line(combinedTable, {\n x: (d) => d.yearIndex + this_year,\n y: (d) => (+d.yearlyCost / mortgage_principal) * 100,\n title: (d) =>\n `${d.yearIndex + this_year}: ${d3.format(\".2%\")(\n +d.yearlyCost / mortgage_principal\n )}`,\n tip: true,\n stroke: \"red\"\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":305,"value":"#### This shows the two costs of ownership side-by-side. \n\nTaking out a home equity loan increases the amount of money you spend on interest.","pinned":false,"hidden":false,"mode":"md"},{"id":291,"value":"Plot.plot({\n marginLeft: 60,\n x: {\n label: \"Year\",\n tickFormat: \"\"\n },\n y: {\n label: \"%\",\n grid: true\n },\n marks: [\n Plot.ruleY([0]),\n Plot.line(combinedTable, {\n x: (d) => d.yearIndex + this_year,\n y: (d) => +d.cumulativeYearlyCost,\n title: (d) =>\n `${d.yearIndex + this_year}: ${d3.format(\"$,.0f\")(\n +d.cumulativeYearlyCost\n )}`,\n tip: true,\n stroke: \"red\"\n }),\n Plot.line(mortgageTable, {\n x: (d) => d.yearIndex + this_year,\n y: (d) => +d.cumulativeEffectiveRate * mortgage_principal,\n stroke: \"blue\",\n title: (d) =>\n `${d.yearIndex + this_year}: ${d3.format(\"$,.0f\")(\n d.cumulativeEffectiveRate * mortgage_principal\n )}`,\n tip: true\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":308,"value":"#### This shows how much you'd be paying total each month, in principal, interest, and taxes with your current mortgage and a home equity loan.\n\nYou'll see that the costs of the home equity loan will explode monthly payments for the time they're active. Costs are likely to exceed $3,500 a month. Note that this doesn't include insurance.","pinned":false,"hidden":false,"mode":"md"},{"id":446,"value":"### Monthly costs by year","pinned":false,"hidden":false,"mode":"md"},{"id":310,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":350,"value":"# Okay, now let's do a comparison – imagine downsizing for a second\n\nI pre-populated these figures based on a [cute, small house in East Longmeadow](https://www.zillow.com/homedetails/32-Dorset-St-East-Longmeadow-MA-01028/56168298_zpid/). ","pinned":false,"hidden":false,"mode":"md"},{"id":353,"value":"viewof new_price = Inputs.range([0, 700000], {\n value: 300000,\n label: \"What's the price of the new place?\",\n step: 1000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":356,"value":"viewof new_principal = Inputs.range([0, 700000], {\n value: new_price * 0.8,\n label: \"How much money are you borrowing\",\n step: 1000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":360,"value":"*This is pre-populated assuming a 20% downpayment.*","pinned":false,"hidden":false,"mode":"md"},{"id":364,"value":"viewof new_rate = Inputs.range([0, 10], {\n value: 5.6,\n label: \"What's the new mortgage rate?\",\n step: 0.005\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":371,"value":"*This is pre-populated with a competitive rate for a 30-year mortgage.*","pinned":false,"hidden":false,"mode":"md"},{"id":368,"value":"viewof new_years = Inputs.range([0, 30], {\n value: 300000,\n label: \"How many years is the loan for?\",\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":378,"value":"viewof new_taxes = Inputs.range([0, 8000], {\n value: 280,\n label: \"What are the monthly taxes?\",\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":470,"value":"viewof tax_increase_new = Inputs.range([0, 10], {\n label: \"How much do you think your taxes will go up each year as a percent?\",\n value: tax_increase*.85,\n step: 0.01\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":383,"value":"*This value is pre-populated to indicate that taxes in the lower-tax area will increase 15% slower than in the high-tax area.*","pinned":false,"hidden":false,"mode":"md"},{"id":387,"value":"#### Effective cost of ownership as percentage of initial loan\n\nNew house costs are in green, the status quo is in blue and the scenario of the home equity loan is in red.\n\nYou'll see that higher interest rates mean higher costs for a while, but not forever. \n\n*Because this uses the initial loan value as the denominator, it can do weird things if you make a very big down payment or buy a much cheaper home.*","pinned":false,"hidden":false,"mode":"md"},{"id":389,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":415,"value":"#### Effective cost of ownership in real dollars\n\nNew house costs are in green, the status quo is in blue and the scenario of the home equity loan is in red.\n\nThe thing to notice here is that, when it comes to actual dollars, the lower interest rate you have now may be entirely set off by lower tax rates. ","pinned":false,"hidden":false,"mode":"md"},{"id":420,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":455,"value":"### Here are your monthly costs by year with the new place","pinned":false,"hidden":false,"mode":"md"},{"id":448,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":75,"value":"## Dependencies and math","pinned":false,"hidden":false,"mode":"md"},{"id":81,"value":"real_tax_rate = (taxes * 12) / home_cost","pinned":true,"hidden":false,"mode":"ojs"},{"id":20,"value":"monthly_mortgage_payment = monthlyPayment(\n mortgage_principal,\n mortgage_rate,\n mortgage_years\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":33,"value":"function monthlyPayment(principal, annualRate, years) {\n const i = annualRate / 12 / 100; // monthly interest rate\n const n = years * 12; // total number of payments\n return (principal * i) / (1 - Math.pow(1 + i, -n));\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":254,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":78,"value":"mortgageTable = amortizationTable(\n mortgage_principal,\n mortgage_rate / 100,\n mortgage_years,\n home_cost,\n real_tax_rate,\n tax_increase / 100,\n years_ago\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":198,"value":"homeEquityTable = amortizationTable(\n equity_loan,\n equity_rate/100,\n equity_term,\n home_cost,\n 0,\n 0, \n 0)","pinned":false,"hidden":false,"mode":"ojs"},{"id":233,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":235,"value":"combinedTable = combineTables(mortgageTable, homeEquityTable)","pinned":true,"hidden":false,"mode":"ojs"},{"id":176,"value":"this_year = new Date().getFullYear()","pinned":true,"hidden":false,"mode":"ojs"},{"id":312,"value":"varsToPivot = [\"interestPaid\", \"principalPaid\", \"propertyTax\"]","pinned":true,"hidden":false,"mode":"ojs"},{"id":314,"value":"longTable = combinedTable.flatMap((row) =>\n varsToPivot.map((variable) => ({\n yearIndex: row.yearIndex,\n calendarYear: row.calendarYear,\n loanAmount: row.loanAmount,\n variable, // \"interestPaid\", \"principalPaid\", or \"propertyTax\"\n value: row[variable] // numeric value\n }))\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":374,"value":"newTable = amortizationTable(\n new_principal,\n new_rate / 100,\n new_years,\n new_price,\n new_tax_rate,\n (tax_increase / 100) * 0.85,\n 0\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":393,"value":"new_tax_rate = (new_taxes * 12) / new_price","pinned":true,"hidden":false,"mode":"ojs"},{"id":451,"value":"newMonthlyTable = newTable.flatMap((row) =>\n varsToPivot.map((variable) => ({\n yearIndex: row.yearIndex,\n calendarYear: row.calendarYear,\n loanAmount: row.loanAmount,\n variable, // \"interestPaid\", \"principalPaid\", or \"propertyTax\"\n value: row[variable] // numeric value\n }))\n)","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W37","stdlib":"1","titling":"auto"}