29:null 2a:["$","title",null,{"children":"Where can I afford to rent? | Naël Shiab | Observable"}] 2f:T786,summaryOfFindings = md` According to a CBC News analysis of more than 1,000 neighbourhoods across metropolitan areas, **less than one percent** of rentals are **vacant** and **affordable** for the majority of Canadian renters. To measure the scale of the rental housing crisis, CBC News purchased custom Census data from Statistics Canada and updated it with the latest Rental Market Survey from the Canada Mortgage and Housing Corporation, conducted in October 2023. Here's what we found: - For **families** earning the median income for renters, **only ${j.formatNumber( familiesData.perc, { significantDigits: 1, suffix: "%" } )}** of all two-bedroom or larger rentals were available and affordable to rent. This represents **just ${j.formatNumber( familiesData.totalVacantAndAffordable, { significantDigits: 2 } )}** homes across all metropolitan areas. - For **lone-parent families**, it drops to **${j.formatNumber( loneParentsData.perc, { significantDigits: 1, suffix: "%" } )}**, or **${j.formatNumber(loneParentsData.totalVacantAndAffordable, { significantDigits: 2 })}** homes. - It's worst for **minimum-wage workers** looking to rent a bachelor or a one-bedroom appartment, with **only ${j.formatNumber( minimumWageWorkersData.perc, { significantDigits: 1, suffix: "%" } )}** available and affordable. This represents **${j.formatNumber( minimumWageWorkersData.totalVacantAndAffordable, { significantDigits: 2 } )} homes** across all metropolitan areas. - On average, the **rent** for a two-bedroom has increased **70 per cent faster than wages** across the country since 2018. In Nova Scotia, New Brunswick, and Alberta, the cost of rentals increased almost **two times faster** than wages. - **All provinces** have a **housing shortage** (vacancy rate below 3%) in 2023. The lowest vacancy rates are in Atlantic provinces. It's below 1% in Nova Scotia and Prince Edward Island. `30:T736,#### Rent To adjust the **rent**, we used the **[Rental Market Survey Data Tables from the Canada Mortgage and Housing Corporation](https://www.cmhc-schl.gc.ca/professionals/housing-markets-data-and-research/housing-data/data-tables/rental-market)**, which is also broken down per number of bedrooms. We retrieved the 2021 and 2023 data for all zones of all metropolitan areas and calculated an inflation rate based on it. The exact name of the sheet used is _3.1.2 Private Row (Townhouse) and Apartment Average Rents ($), by Zone and Bedroom Type_. It's important to note that the CMHC data covers the primary rental market (privately initiated purpose-built rental apartments with three or more units). Because we don't have another reliable data source, we have to assume that the inflation rate of rents in the secondary market (basement units, duplex, triplex, etc.) is the same as in the primary market. To match FSAs with CMHC zones, we did a spatial join and calculated the intersection areas. For each FSA, we kept the biggest intersecting zone. The Census has a category _4 or more bedrooms_ while the CMHC data stops with _3 bedrooms +_. So we matched the _4 or more bedrooms_ category with the _3 bedrooms +_ numbers. When the data was unavailable for a specific bedroom type in a zone, we used the value from the next aggregated area (a bigger zone covering multiple smaller zones) or the CMA number for the same number of bedrooms. This assumes that the main driver of rent is the number of bedrooms. For example, our two-bedroom home in the H4G area is located in the Sud-Ouest/Verdun zone in Montreal. According to the CMHC data: - The average rent for a two-bedroom was $828 in October 2021 and $1,047 in October 2023 - This translates to an inflation rate of 26.4% - So, we adjust our 2021 Census rent from $864 to $1,09231:T971,### Rent of vacant units The Census measures how much people were paying in _occupied_ units. But when you move out to a new place, you pay the rent of a _vacant_ unit, which is often more. To adjust the **rent** one last time, we calculated and applied the percentage difference between the average rent of occupied and vacant units from the CMHC data. The October 2023 data is available per number of bedrooms in zones of metropolitan areas. The exact name of the sheet is _3.1.9 Private Row (Townhouse) and Apartment Average Rents ($) of Vacant and Occupied Units by Zone and Bedroom Type_. Again, it's important to note that the CMHC data covers the primary rental market (privately initiated purpose-built rental apartments with three or more units). Because we don't have another reliable data source, we have to assume that the percentage difference between the average rent of occupied and vacant units in the secondary market (basement units, duplex, triplex, etc.) is the same as in the primary market. When the data was unavailable for a specific bedroom type in a zone, we used the general average values of the zone. This assumes that the neighbourhood is the primary driver of the rent difference between vacant and occupied units. We used the next aggregated area or the CMA values when the general average values were also missing in the zone. The CMHC tested the statistical significance of the average rents of vacant units being higher than those of occupied units. When the test result was true, we kept the rents of both vacant and occupied units. When the test result was false, we considered that the rents of vacant units were the same as that of occupied units. The Census has a category _4 or more bedrooms_ while the CMHC data stops with _3 bedrooms +_. So we matched the _4 or more bedrooms_ category with the _3 bedrooms +_ numbers. For example, for our two-bedroom home in the H4G area: - There is no data for vacant two-bedroom units in the Sud-Ouest/Verdun zone - As a fallback, we use the general averages for all bedroom configurations - The average rent for vacant units in the zone is $1,614 - The average rent for occupied units in the zone is $1,079 - The difference is statistically significant according to the test run by the CMCH - This means that vacant units are 50% more expensive than occupied units, on average - So, we adjust our rent from $1,092 to $1,63832:T6c6,### Available units To count the number of potential homes in a zone, we used the number of households from the 2021 Census and the vacancy rates from the CMHC. The exact name of the sheet in the CMHC data is _3.1.1 Private Row (Townhouse) and Apartment Vacancy Rates (%), by Zone and Bedroom Type - Montréal CMA_. When the data was unavailable for a specific bedroom type in a zone, we used the general value of the zone. This assumes that the main driver of the vacancy rate is the neighbourhood. We used the next aggregated area or the CMA values when the general average values were also missing in the zone. Again, it's important to note that the CMHC data covers the primary rental market (privately initiated purpose-built rental apartments with three or more units). Because we don't have another reliable data source, we have to assume that the vacancy rate in the secondary market (basement units, duplex, triplex, etc.) is the same as in the primary market. The Census has a category _4 or more bedrooms_ while the CMHC data stops with _3 bedrooms +_. So we matched the _4 or more bedrooms_ category with the _3 bedrooms +_ numbers. For example, for our two-bedroom home in the H4G area (Sud-Ouest/Verdun zone in Montreal in the CMHC data): - There were 4,695 two-bedroom homes occupied by renters according to the latest census - The vacancy rate for two-bedroom homes in the zone was 0.4% in October 2023, according to the CMHC - The vacancy rate is calculated over the total number of two-bedroom homes. We can get the total number by using the reverse percentage: - 4,695/(1 - 0.004) = 4,714 - And by multiplying the total number by the vacancy rate, we find 19 potentially available 2-bedroom homes in the FSA.33:T5c9,### Median incomes The household median income (2020) of renters per CMA comes from the data purchased from Statistics Canada. We adjusted the values based on the [Employee wages by industry, annual](https://www150.statcan.gc.ca/t1/tbl1/en/cv.action?pid=1410006401) from Statistics Canada. We calculated the average hourly wage increase from 2020 to 2023 in each province and applied it to the 2020 household median income. For example, for Montreal, this gives us: - a household median income of $51,600 for renters - an average hourly wage of $28.56 in 2020 and $32.39 in 2023 (province of Quebec) - which translates to an increase of 13.4% - which adjusts our median income to $58,514 The Canadian individual median income comes from [Statistics Canada](https://www150.statcan.gc.ca/t1/tbl1/en/tv.action?pid=1110023901) and has been adjusted with the average hourly wages. The median income (excluding zeros) was $41,200 in 2021. The average hourly wage increased from $30.67 in 2021 to $33.55 in 2023 (+9.4%). So our adjusted median income is $45,069. The Canadian median total income of renter families (non-elderly couples with children) and renter lone-parent families comes from Statistics Canada (Canadian Income Survey) have been adjusted with the average hourly wages. The median income for families was $58,600 in 2021. So our adjusted median income is $64,108 (+9.4% as above). For lone-parent families, it was $49,300, which gives us $53,934 after adjustments.34:Tf27,personaIncomes = { const minimumWagesProvinces = [ { province: "Alberta", minimumWage: 15.0 }, { province: "British Columbia", minimumWage: 16.75 }, { province: "Manitoba", minimumWage: 15.3 }, { province: "New Brunswick", minimumWage: 14.75 }, { province: "Newfoundland and Labrador", minimumWage: 15.0 }, { province: "Northwest Territories", minimumWage: 16.05 }, { province: "Nova Scotia", minimumWage: 15.0 }, { province: "Nunavut", minimumWage: 16.0 }, { province: "Ontario", minimumWage: 16.55 }, { province: "Prince Edward Island", minimumWage: 15.0 }, { province: "Quebec", minimumWage: 15.25 }, { province: "Saskatchewan", minimumWage: 14.0 }, { province: "Yukon", minimumWage: 16.77 } ].map((d) => ({ ...d, annualIncome: d.minimumWage * 40 * 52 })); const minimumWagesCMAs = [ { cma: "Abbotsford - Mission", province: "British Columbia" }, { cma: "Barrie", province: "Ontario" }, { cma: "Belleville - Quinte West", province: "Ontario" }, { cma: "Brantford", province: "Ontario" }, { cma: "Calgary", province: "Alberta" }, { cma: "Charlottetown", province: "Prince Edward Island" }, { cma: "Edmonton", province: "Alberta" }, { cma: "Greater Sudbury", province: "Ontario" }, { cma: "Guelph", province: "Ontario" }, { cma: "Halifax", province: "Nova Scotia" }, { cma: "Hamilton", province: "Ontario" }, { cma: "Kelowna", province: "British Columbia" }, { cma: "Kingston", province: "Ontario" }, { cma: "Kitchener - Cambridge - Waterloo", province: "Ontario" }, { cma: "Lethbridge", province: "Alberta" }, { cma: "London", province: "Ontario" }, { cma: "Moncton", province: "New Brunswick" }, { cma: "Montréal", province: "Quebec" }, { cma: "Oshawa", province: "Ontario" }, { cma: "Ottawa - Gatineau", province: "Ontario" }, // Keeping only the highest min wage between Québec and Ontario // { cma: "Ottawa - Gatineau", province: "Quebec" }, { cma: "Peterborough", province: "Ontario" }, { cma: "Québec", province: "Quebec" }, { cma: "Regina", province: "Saskatchewan" }, { cma: "Saguenay", province: "Quebec" }, { cma: "Saint John", province: "New Brunswick" }, { cma: "Saskatoon", province: "Saskatchewan" }, { cma: "Sherbrooke", province: "Quebec" }, { cma: "St. Catharines - Niagara", province: "Ontario" }, { cma: "St. John's", province: "Newfoundland and Labrador" }, { cma: "Thunder Bay", province: "Ontario" }, { cma: "Toronto", province: "Ontario" }, { cma: "Vancouver", province: "British Columbia" }, { cma: "Victoria", province: "British Columbia" }, { cma: "Windsor", province: "Ontario" }, { cma: "Winnipeg", province: "Manitoba" } ].map((d) => { const obj = { ...d, annualIncome: minimumWagesProvinces.find((p) => p.province === d.province) .annualIncome }; return obj; }); const medianIncomesRentersCMAs = await FileAttachment( "medianIncomeRentersCMA.csv" ).csv({ typed: true }); const individualCanadianMedianIncome = Math.round( 41200 + 41200 * ((33.55 - 30.67) / 30.67) ); const canadianRenterFamiliesMedianIncome = Math.round( 58600 + 58600 * ((33.55 - 30.67) / 30.67) ); const canadianRenterLoneParentsMedianIncome = Math.round( 49300 + 49300 * ((33.55 - 30.67) / 30.67) ); const canadianRentersHouseholdsMedianIncome = Math.round( 54800 + 54800 * ((33.55 - 30.03) / 30.03) ); const canadiansAllHouseholdsMedianIncome = Math.round( 83000 + 83000 * ((33.55 - 30.03) / 30.03) ); return { minimumWagesCMAs, medianIncomesRentersCMAs, individualCanadianMedianIncome, canadianRenterFamiliesMedianIncome, canadianRenterLoneParentsMedianIncome, canadianRentersHouseholdsMedianIncome, canadiansAllHouseholdsMedianIncome }; }35:T40c,familiesData = { const twoBedrooms = getPersonaData( dataFSAs, "Median family income (renters, Canada)", personas, personaIncomes, "Two-bedroom" ); const threeBedrooms = getPersonaData( dataFSAs, "Median family income (renters, Canada)", personas, personaIncomes, "Three-bedroom" ); const fourBedroomsOrBigger = getPersonaData( dataFSAs, "Median family income (renters, Canada)", personas, personaIncomes, "Four-bedroom or bigger" ); const totalVacantAndAffordable = twoBedrooms.affordableAndVacantToRentCountBedrooms + threeBedrooms.affordableAndVacantToRentCountBedrooms + fourBedroomsOrBigger.affordableAndVacantToRentCountBedrooms; const totalBedroomsToRent = twoBedrooms.rentersTotalCountBedrooms + threeBedrooms.rentersTotalCountBedrooms + fourBedroomsOrBigger.rentersTotalCountBedrooms; return { totalVacantAndAffordable, totalBedroomsToRent, perc: (totalVacantAndAffordable / totalBedroomsToRent) * 100 }; }36:T41e,loneParentsData = { const twoBedrooms = getPersonaData( dataFSAs, "Median lone-parent income (renters, Canada)", personas, personaIncomes, "Two-bedroom" ); const threeBedrooms = getPersonaData( dataFSAs, "Median lone-parent income (renters, Canada)", personas, personaIncomes, "Three-bedroom" ); const fourBedroomsOrBigger = getPersonaData( dataFSAs, "Median lone-parent income (renters, Canada)", personas, personaIncomes, "Four-bedroom or bigger" ); const totalVacantAndAffordable = twoBedrooms.affordableAndVacantToRentCountBedrooms + threeBedrooms.affordableAndVacantToRentCountBedrooms + fourBedroomsOrBigger.affordableAndVacantToRentCountBedrooms; const totalBedroomsToRent = twoBedrooms.rentersTotalCountBedrooms + threeBedrooms.rentersTotalCountBedrooms + fourBedroomsOrBigger.rentersTotalCountBedrooms; return { totalVacantAndAffordable, totalBedroomsToRent, perc: (totalVacantAndAffordable / totalBedroomsToRent) * 100 }; }37:Td42,function computeFSAs(bedrooms, annualIncome, dataFSAs, cma = undefined) { const computedData = []; const rentsOccupied = cma ? dataFSAs.rentOccupied.filter((d) => d.cma === cma) : dataFSAs.rentOccupied; for (const rentOccupied of rentsOccupied) { const cma = rentOccupied.cma; const fsa = rentOccupied.fsa; const zoneCode = rentOccupied.zoneCode; const zoneName = rentOccupied.zoneName; const rentOccupiedBedrooms = rentOccupied[bedrooms]; const otherCosts = dataFSAs.otherCosts.find((d) => d.fsa === fsa); const otherCostsBedrooms = otherCosts ? otherCosts[bedrooms] : null; const rentersOccupiedCount = dataFSAs.rentersOccupiedCount.find( (d) => d.fsa === fsa ); const rentersOccupiedCountBedrooms = rentersOccupiedCount ? rentersOccupiedCount[bedrooms] : null; const totalOccupiedCount = dataFSAs.totalOccupiedCount.find( (d) => d.fsa === fsa ); const totalOccupiedCountAll = totalOccupiedCount ? totalOccupiedCount["All"] : null; const totalOccupiedCountBedrooms = totalOccupiedCount ? totalOccupiedCount[bedrooms] : null; const vacancy = dataFSAs.vacancyRates.find((d) => d.fsa == fsa); const vacancyBedrooms = vacancy ? vacancy[bedrooms] : null; let rentersTotalCountBedrooms = null; let rentersVacantCountBedrooms = null; if ( typeof rentersOccupiedCountBedrooms === "number" && typeof vacancyBedrooms === "number" ) { rentersTotalCountBedrooms = Math.round( rentersOccupiedCountBedrooms / (1 - vacancyBedrooms / 100) ); rentersVacantCountBedrooms = Math.round( rentersTotalCountBedrooms * (vacancyBedrooms / 100) ); } const percDiffOccupiedVacant = dataFSAs.percDiffOccupiedVacant.find( (d) => d.fsa === fsa ); const percDiffOccupiedVacantBedrooms = percDiffOccupiedVacant ? percDiffOccupiedVacant[bedrooms] : null; let rentVacantBedrooms = null; let shelterCostsVacantBedrooms = null; let percIncome = null; let affordableAndVacantToRentCountBedrooms = null; let affordableFSA = null; if ( typeof rentOccupiedBedrooms === "number" && typeof otherCostsBedrooms === "number" && typeof percDiffOccupiedVacantBedrooms === "number" ) { rentVacantBedrooms = Math.round( rentOccupiedBedrooms + rentOccupiedBedrooms * percDiffOccupiedVacantBedrooms ); shelterCostsVacantBedrooms = rentVacantBedrooms + otherCostsBedrooms; percIncome = j.round(shelterCostsVacantBedrooms / (annualIncome / 12), { decimals: 2 }); if (percIncome <= 0.3) { affordableAndVacantToRentCountBedrooms = rentersVacantCountBedrooms; affordableFSA = true; } else { affordableAndVacantToRentCountBedrooms = -9999; // For the map affordableFSA = false; } } computedData.push({ cma, fsa, zoneCode, zoneName, otherCostsBedrooms, totalOccupiedCountAll, totalOccupiedCountBedrooms, rentersTotalCountBedrooms, rentersOccupiedCountBedrooms, vacancyBedrooms, rentersVacantCountBedrooms, affordableAndVacantToRentCountBedrooms, rentVacantBedrooms, shelterCostsVacantBedrooms, percIncome, affordableFSA }); } return computedData; }38:T9b6,function getUserData(bedrooms, annualIncome, dataFSAs, cma) { { const computedFSAsOverview = computeFSAs(bedrooms, annualIncome, dataFSAs); const computedFSAs = computedFSAsOverview.filter((d) => d.cma === cma); const computedCMAs = []; const cmas = Array.from(new Set(computedFSAsOverview.map((d) => d.cma))); for (const cma of cmas) { const filteredCMA = computedFSAsOverview.filter((d) => d.cma === cma); const computedCMA = { cma, affordableAndVacantToRentCountBedrooms: getAffordableAndVacantBedrooms(filteredCMA), rentersTotalCountBedrooms: getRentersTotalCountBedrooms(filteredCMA), perc: 0 }; computedCMA.perc = computedCMA.affordableAndVacantToRentCountBedrooms / computedCMA.rentersTotalCountBedrooms; computedCMAs.push(computedCMA); } const affordableAndVacantBedrooms = getAffordableAndVacantBedrooms(computedFSAs); const rentersTotalCountBedrooms = getRentersTotalCountBedrooms(computedFSAs); return { cma, bedrooms, computedFSAs, affordableThreshold: Math.round((annualIncome / 12) * 0.3), // USER CMA affordableFSAsWithAtLeastOneVacant: getAffordableFSAsWithAtLeastOneVacant(computedFSAs), totalOccupiedCountAll: getTotalOccupiedCountAllOverview(computedFSAs), totalOccupiedCountBedrooms: getTotalOccupiedCountBedrooms(computedFSAs), rentersTotalCountBedrooms, rentersVacantCountBedrooms: getRentersVacantCountBedrooms(computedFSAs), affordableAndVacantBedrooms, percAffordableAndVacantBedrooms: j.formatNumber( (affordableAndVacantBedrooms / rentersTotalCountBedrooms) * 100, { significantDigits: 2, suffix: "%" } ), // ALL CMAs computedFSAsOverview, affordableFSAsWithAtLeastOneVacantOverview: getAffordableFSAsWithAtLeastOneVacant(computedFSAsOverview), totalOccupiedCountAllOverview: getTotalOccupiedCountAllOverview(computedFSAsOverview), totalOccupiedCountBedroomsOverview: getTotalOccupiedCountBedrooms(computedFSAsOverview), rentersTotalCountBedroomsOverview: getRentersTotalCountBedrooms(computedFSAsOverview), rentersVacantCountBedroomsOverview: getRentersVacantCountBedrooms(computedFSAsOverview), affordableAndVacantBedroomsOverview: getAffordableAndVacantBedrooms(computedFSAsOverview), computedCMAs }; } }39:Te93,function getPersonaData( dataFSAs, persona, personas, personaIncomes, bedroomsPersona, cma = undefined ) { const personaDetails = personas.find((d) => d.name === persona); // We grab the right annual incomes let annualIncomeCMA = []; if (personaDetails.income.includes("Minimum")) { if (persona.includes("Two")) { annualIncomeCMA = personaIncomes.minimumWagesCMAs.map((d) => ({ ...d, annualIncome: d.annualIncome * 2 })); } else { annualIncomeCMA = personaIncomes.minimumWagesCMAs; } } else if (personaDetails.income.includes("Median")) { if (persona === "Median household income (renters, CMA)") { annualIncomeCMA = personaIncomes.medianIncomesRentersCMAs.map((d) => ({ cma: d.cma, annualIncome: d.All })); } else if (persona === "Median individual income (overall, Canada)") { annualIncomeCMA = personaIncomes.medianIncomesRentersCMAs.map((d) => ({ cma: d.cma, annualIncome: personaIncomes.individualCanadianMedianIncome })); } else if (persona === "Median family income (renters, Canada)") { annualIncomeCMA = personaIncomes.medianIncomesRentersCMAs.map((d) => ({ cma: d.cma, annualIncome: personaIncomes.canadianRenterFamiliesMedianIncome })); } else if (persona === "Median lone-parent income (renters, Canada)") { annualIncomeCMA = personaIncomes.medianIncomesRentersCMAs.map((d) => ({ cma: d.cma, annualIncome: personaIncomes.canadianRenterLoneParentsMedianIncome })); } else if (persona === "Median household income (overall, Canada)") { annualIncomeCMA = personaIncomes.medianIncomesRentersCMAs.map((d) => ({ cma: d.cma, annualIncome: personaIncomes.canadiansAllHouseholdsMedianIncome })); } else if (persona === "Median household income (renters, Canada)") { annualIncomeCMA = personaIncomes.medianIncomesRentersCMAs.map((d) => ({ cma: d.cma, annualIncome: personaIncomes.canadianRentersHouseholdsMedianIncome })); } else { throw new Error(`Unknown ${persona}`); } } if (typeof cma === "string") { annualIncomeCMA = annualIncomeCMA.filter((d) => d.cma === cma); } const bedroomsPersonaArray = bedroomsPersona === "All" ? [ "Bachelor", "One-bedroom", "Two-bedroom", "Three-bedroom", "Four-bedroom or bigger" ] : [bedroomsPersona]; // We compute the data for each CMA. const computedCMAs = []; for (let annualIncome of annualIncomeCMA) { const tempData = []; for (let bedroomsItem of bedroomsPersonaArray) { const computedData = computeFSAs( bedroomsItem, annualIncome.annualIncome, dataFSAs, annualIncome.cma ); tempData.push({ cma: annualIncome.cma, annualIncome: annualIncome.annualIncome, affordableAndVacantToRentCountBedrooms: getAffordableAndVacantBedrooms(computedData), rentersTotalCountBedrooms: getRentersTotalCountBedrooms(computedData) }); } computedCMAs.push({ cma: annualIncome.cma, annualIncome: annualIncome.annualIncome, affordableAndVacantToRentCountBedrooms: getAffordableAndVacantBedrooms(tempData), rentersTotalCountBedrooms: getRentersTotalCountBedrooms(tempData) }); } return { computedCMAs, affordableAndVacantToRentCountBedrooms: computedCMAs.reduce( (acc, d) => (acc += d.affordableAndVacantToRentCountBedrooms), 0 ), rentersTotalCountBedrooms: computedCMAs.reduce( (acc, d) => (acc += d.rentersTotalCountBedrooms), 0 ) }; }3a:Taba,function makeProvinceOverviewChart(province, provincesData) { const width = 350; const height = 300; const inset = 20; const filteredData = provincesData .filter((d) => d.Geography === province) .map((d) => ({ ...d, Year: new Date(Date.UTC(d.Year)) })); const thresholdVacancyData = [ { Year: new Date(Date.UTC(2018)), "V. rate (two-bedroom)": 3 }, { Year: new Date(Date.UTC(2023)), "V. rate (two-bedroom)": 3 } ]; const textVacancyData = [ { Year: new Date(Date.UTC(2018) + (Date.UTC(2023) - Date.UTC(2018)) / 2), "V. rate (two-bedroom)": 3 } ]; const vacancyRateChart = Plot.plot({ width, height, insetLeft: inset, insetBottom: inset, insetTop: inset, grid: true, y: { tickFormat: (d) => `${d}%`, label: "Vacancy rate" }, color: { domain: ["Vacancy rate for a two-bedroom"], range: ["red"], legend: true }, marks: [ Plot.line(filteredData, { x: "Year", y: "V. rate (two-bedroom)", stroke: "red", marker: "circle" }), Plot.line(thresholdVacancyData, { x: "Year", y: "V. rate (two-bedroom)", strokeDasharray: "4 4" }), Plot.text(textVacancyData, { x: "Year", y: "V. rate (two-bedroom)", text: () => "Below 3% is a housing shortage", dy: -10, fontWeight: "bold", stroke: "white", fill: "black" }) ] }); const rentsAndWagesChart = Plot.plot({ y: { tickFormat: "%", label: "Percentage increase" }, color: { domain: ["Avg. hourly wage", "Avg. rent (two-bedroom)"], range: ["blue", "orange"], legend: true }, marginRight: 125, grid: true, insetBottom: inset, insetLeft: inset, width: width * 1.25, height, marks: [ Plot.line(filteredData, { x: "Year", y: "Avg. hourly wage var.", stroke: "blue", marker: "circle" }), Plot.line(filteredData, { x: "Year", y: "Avg. rent var. (two-bedroom)", stroke: "orange", marker: "circle" }), Plot.text( filteredData, Plot.selectLast({ x: "Year", y: "Avg. rent var. (two-bedroom)", text: (d) => `← Between 2018\n and 2023, rents\n increased ${ d.Diff * 100 }%\n faster than\n wages`, textAnchor: "start", lineAnchor: "top", dx: 5, dy: -4, lineHeight: 1.1, fontWeight: "bold" }) ) ] }); return htl.html`

${vacancyRateChart} ${rentsAndWagesChart}

`; }3b:Tffa,function getSankeyData(userData, bedrooms) { const allHomes = userData.totalOccupiedCountAll; const allHomesLabel = `All homes in Toronto...\n${j.formatNumber(allHomes)}`; const allBedrooms = userData.totalOccupiedCountBedrooms; const allBedroomsLabel = `...${userData.bedrooms.toLowerCase()} homes\n${j.formatNumber( allBedrooms )}`; const differentBedrooms = allHomes - allBedrooms; const differentBedroomsLabel = "Different size"; const allBedroomsRented = userData.rentersTotalCountBedrooms; const allBedroomsRentedLabel = `...for renters\n${j.formatNumber( allBedroomsRented )} (100%)`; const allBedroomsNotRented = allBedrooms - allBedroomsRented; const allBedroomsNotRentedLabel = "Not rentals"; const rentersVacantCountBedrooms = userData.rentersVacantCountBedrooms; const rentersVacantCountBedroomsLabel = `...potentially vacant\n${j.formatNumber( rentersVacantCountBedrooms )} (${j.formatNumber((rentersVacantCountBedrooms / allBedroomsRented) * 100, { significantDigits: 2, suffix: "%" })})`; const rentersOccupiedCountBedrooms = allBedroomsRented - rentersVacantCountBedrooms; const rentersOccupiedCountBedroomsLabel = `Occupied`; const affordableAndVacantBedrooms = userData.affordableAndVacantBedrooms; const affordableAndVacantBedroomsLabel = `...in an affordable\nneighbourhood\n${j.formatNumber( affordableAndVacantBedrooms )}, (${j.formatNumber( (affordableAndVacantBedrooms / allBedroomsRented) * 100, { significantDigits: 2, suffix: "%" } )})`; const unaffordableAndVacantBedrooms = rentersVacantCountBedrooms - affordableAndVacantBedrooms; const unaffordableAndVacantBedroomsLabel = `Unaffordable neighbourhood`; const nodes = [ { name: allHomesLabel, align: "center", verticalAlign: "top", highlight: true }, { name: allBedroomsLabel, align: "right", verticalAlign: "middle", highlight: true }, { name: differentBedroomsLabel, align: "center", verticalAlign: "bottom" }, { name: allBedroomsRentedLabel, align: "right", verticalAlign: "middle", highlight: true }, { name: allBedroomsNotRentedLabel, align: "left", verticalAlign: "middle" }, { name: rentersVacantCountBedroomsLabel, align: "right", verticalAlign: "middle", highlight: true }, { name: rentersOccupiedCountBedroomsLabel, align: "left", verticalAlign: "middle" }, { name: affordableAndVacantBedroomsLabel, align: "right", verticalAlign: "middle", highlight: true }, { name: unaffordableAndVacantBedroomsLabel, align: "left", verticalAlign: "middle" } ]; function minValue(value) { return value ? value : 0.01; } const links = [ { source: allHomesLabel, target: differentBedroomsLabel, value: differentBedrooms }, { source: allHomesLabel, target: allBedroomsLabel, value: minValue(allBedrooms), highlight: true }, { source: allBedroomsLabel, target: allBedroomsNotRentedLabel, value: minValue(allBedroomsNotRented) }, { source: allBedroomsLabel, target: allBedroomsRentedLabel, value: minValue(allBedroomsRented), highlight: true }, { source: allBedroomsRentedLabel, target: rentersOccupiedCountBedroomsLabel, value: minValue(rentersOccupiedCountBedrooms) }, { source: allBedroomsRentedLabel, target: rentersVacantCountBedroomsLabel, value: minValue(rentersVacantCountBedrooms), highlight: true }, { source: rentersVacantCountBedroomsLabel, target: unaffordableAndVacantBedroomsLabel, value: minValue(unaffordableAndVacantBedrooms) }, { source: rentersVacantCountBedroomsLabel, target: affordableAndVacantBedroomsLabel, value: minValue(affordableAndVacantBedrooms), highlight: true } ]; return { nodes, links }; }3c:Ta3f,function makeSankeyChart(sankeyData) { const width = 600; const height = 800; const svg = d3 .create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .attr("style", "max-width: 100%; height: auto; font: 14px sans-serif;"); const sankey = d3Sankey .sankey() .nodeId((d) => d.name) .linkSort(null) .nodeAlign(d3Sankey.sankeyLeft) // d3.sankeyLeft, etc. .nodeWidth(10) .nodePadding(25) .extent([ [30, 0], [height - 30, width - 150] ]); const { nodes, links } = sankey(sankeyData); const rect = svg .append("g") .selectAll() .data(nodes) .join("rect") .attr("x", (d) => d.y0) .attr("y", (d) => d.x0) .attr("height", (d) => d.x1 - d.x0) .attr("width", (d) => d.y1 - d.y0) .attr("fill", (d) => { if (d.highlight) { return "purple"; } else { return "#cecece"; } }); const link = svg .append("g") .attr("fill", "none") .selectAll() .data(links) .join("g"); const linkVertical = d3 .linkVertical() .source((d) => [d.y0, d.source.x1]) .target((d) => [d.y1, d.target.x0]); link .append("path") .attr("d", linkVertical) .attr("stroke", (d) => (d.highlight ? "lavender" : "whitesmoke")) .attr("stroke-width", (d) => Math.max(1, d.width)); svg .append("g") .selectAll() .data(nodes) .join("text") .each(function (d) { const arr = d.name.split("\n"); for (let i = 0; i < arr.length; i++) { d3.select(this) .append("tspan") .text(arr[i]) .attr("dy", i * 14) .attr("x", function (d) { if (d.align === "left") { return d.y0 - 10; } else if (d.align === "right") { return d.y1 + 10; } else { return d.y0 + (d.y1 - d.y0) / 2; } }) .attr("y", function (d) { if (d.verticalAlign === "top") { return d.x0 - 20; } else if (d.verticalAlign === "bottom") { return d.x1 + 15; } else { return d.x0 + (d.x1 - d.x0) / 2 + 3; } }) .attr("text-anchor", function (d) { if (d.align === "left") { return "end"; } else if (d.align === "right") { return "start"; } else { return "middle"; } }) .attr("fill", (d) => (d.highlight ? "black" : "#b5b5b5")); } }); return svg.node(); }3d:T552,function getPopupContent(properties) { function dontKnow(value, options = {}) { if (value === undefined || value === null) { return "We don't know"; } else if (typeof value === "boolean") { return value === true ? "Yes" : "No"; } else { return j.formatNumber(value, options); } } const innerHTML = `

CMHC zone: ${properties.zoneCode} ${properties.zoneName}

Postal code area: ${properties.fsa}

Vacancy rate: ${dontKnow(properties.vacancyBedrooms, { suffix: "%" })}

Potentially vacant units: ${dontKnow( properties.rentersVacantCountBedrooms )}

Average monthly costs: ${dontKnow( properties.shelterCostsVacantBedrooms, { prefix: "$" } )}

- Rent: ${dontKnow(properties.rentVacantBedrooms, { prefix: "$" })}

- Utilities: ${dontKnow(properties.otherCostsBedrooms, { prefix: "$" })}

% of monthly income: ${dontKnow(properties.percIncome * 100, { round: true, suffix: "%" })}

Affordable: ${dontKnow(properties.affordableFSA)}

`; return innerHTML; }3e:Tc1f,function makeMap(container, userData, FSAsGeoInstersect) { const features = []; for (const d of userData.computedFSAs) { const feature = FSAsGeoInstersect.features.find( (f) => f.properties.fsa === d.fsa ); feature.properties = d; features.push(feature); } const geoDataCMA = { type: "FeatureCollection", features }; const map = (container.value = new maplibregl.Map({ container, style: "https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json" // style URL })); map.on("load", function () { map.addSource("geoDataCMA", { type: "geojson", data: geoDataCMA }); map.addLayer({ id: "geoDataCMA", type: "fill", source: "geoDataCMA", paint: { "fill-color": [ "interpolate", ["linear"], ["get", "affordableAndVacantToRentCountBedrooms"], -9999, "red", 1, "purple", Math.max( d3.max( userData.computedFSAs, (d) => d.affordableAndVacantToRentCountBedrooms ), 10 ), "yellow" ], // You can add other paint properties as needed "fill-opacity": 0.6 // Adjust opacity as needed } }); map.addLayer({ id: "geoDataCMA_line", type: "line", source: "geoDataCMA", paint: { "line-color": "white", "line-width": 1 } }); let hoveredStateFSA = null; map.on("mousemove", "geoDataCMA", (e) => { if (e.features.length > 0) { // If the hovered feature is not the same as the current one if (hoveredStateFSA !== e.features[0].properties.fsa) { map.getCanvas().style.cursor = "pointer"; // Remove the previous hover layer if it exists if (hoveredStateFSA) { map.removeLayer("geoDataCMA_hover"); } hoveredStateFSA = e.features[0].properties.fsa; // Add a new layer with the hover feature map.addLayer({ id: "geoDataCMA_hover", type: "line", source: "geoDataCMA", paint: { "line-color": "blue", "line-width": 3, "line-opacity": 1 }, filter: ["==", "fsa", hoveredStateFSA] // This ensures only the hover feature is in this layer }); } } const popup = document.querySelector("#popup"); popup.style.display = "block"; const properties = e.features[0].properties; popup.innerHTML = getPopupContent(properties); }); map.on("mouseleave", "computedDataGeoCMA", (e) => { map.getCanvas().style.cursor = ""; if (hoveredStateFSA) { map.removeLayer("geoDataCMA_hover"); } hoveredStateFSA = null; const popup = document.querySelector("#popup"); popup.style.display = "none"; }); const bbox = turf.bbox(geoDataCMA); map.fitBounds(bbox, { padding: 20, animate: false // Adjust padding as needed }); }); return map; }3f:T549,function makeOverviewChart(userData, overviewVariable) { return Plot.plot({ grid: true, x: overviewVariable === "Percentage" ? { tickFormat: "%" } : undefined, marginLeft: 200, marginRight: 50, marks: [ Plot.barX(userData.computedCMAs, { x: (d) => overviewVariable === "Percentage" ? d.affordableAndVacantToRentCountBedrooms / d.rentersTotalCountBedrooms : d.affordableAndVacantToRentCountBedrooms, y: "cma", fill: (d) => (d.cma === userData.cma ? "orange" : "purple"), sort: { y: "x" } }), Plot.textX(userData.computedCMAs, { x: (d) => overviewVariable === "Percentage" ? d.affordableAndVacantToRentCountBedrooms / d.rentersTotalCountBedrooms : d.affordableAndVacantToRentCountBedrooms, y: "cma", dx: 20, text: (d) => overviewVariable === "Percentage" ? j.formatNumber( (d.affordableAndVacantToRentCountBedrooms / d.rentersTotalCountBedrooms) * 100, { decimals: 1, suffix: "%" } ) : j.formatNumber(d.affordableAndVacantToRentCountBedrooms), fill: "black", stroke: "white", sort: { y: "x" } }) ] }); }40:T5d0,function provinceDescription(province, provincesData) { const twoBedroomProvince2018 = provincesData.find( (d) => d.Geography === province && d.Year === 2018 ); const twoBedroomProvince2023 = provincesData.find( (d) => d.Geography === province && d.Year === 2023 ); return md` In **${province}**, the ${highlight( "vacancy rate", "red", "white" )} for a two-bedroom home was **${ twoBedroomProvince2023["V. rate (two-bedroom)"] }%** in October 2023, which means ${ twoBedroomProvince2023["V. rate (two-bedroom)"] < 3 ? "there is a **housing shortage**" : "there is no **housing shortage**" }. Between 2018 - 2023: - ${highlight( "Average rent", "orange", "white" )} for a two-bedroom increased by **${ twoBedroomProvince2023["Avg. rent var. (two-bedroom)"] * 100 }%** (from $${j.formatNumber( twoBedroomProvince2018["Avg. rent (two-bedroom)"] )} - $${j.formatNumber( twoBedroomProvince2023["Avg. rent (two-bedroom)"] )} monthly) - ${highlight("Average hourly wage", "blue", "white")} increased by **${ twoBedroomProvince2023["Avg. hourly wage var."] * 100 }%** (from $${j.formatNumber( twoBedroomProvince2018["Avg. hourly wage"] )} - $${j.formatNumber(twoBedroomProvince2023["Avg. hourly wage"])} hourly) That means the average rent ${ twoBedroomProvince2023.Diff >= 0 ? "increased" : "decreased" } **${twoBedroomProvince2023.Diff * 100}% faster** than wages in ${province}. `; }41:[{"id":"2b2b7c9c987012492606723d0405721b931a98a0b24297ed1653624a5929fffa5cd3cda3ca883485523f54905ce14af2bf58570b0a836d0a8234a7bfdf25ddd3","href":"https://static.observableusercontent.com/files/2b2b7c9c987012492606723d0405721b931a98a0b24297ed1653624a5929fffa5cd3cda3ca883485523f54905ce14af2bf58570b0a836d0a8234a7bfdf25ddd3","name":"fsaRentOccupied.csv","type":"text/csv","lastModified":1713187188374.909,"size":82577},{"id":"30fef979022bde999d0a9891639f4e08d02b09dfd3e5d9e6ff6d91e0b4752c933d8afe448045f9cd671a4474190a28e71865271f87285338dcedb408b2673ac3","href":"https://static.observableusercontent.com/files/30fef979022bde999d0a9891639f4e08d02b09dfd3e5d9e6ff6d91e0b4752c933d8afe448045f9cd671a4474190a28e71865271f87285338dcedb408b2673ac3","name":"fsaOtherCosts.csv","type":"text/csv","lastModified":1713187377380.738,"size":48947},{"id":"d194f12509188fc2ec7fd574c5cb89316dfaa0e0a8e48094dd2e465858cab45607e9b128b638e2063e0f243a0b4916291978e46abc11565929f0b53b46ee0fc6","href":"https://static.observableusercontent.com/files/d194f12509188fc2ec7fd574c5cb89316dfaa0e0a8e48094dd2e465858cab45607e9b128b638e2063e0f243a0b4916291978e46abc11565929f0b53b46ee0fc6","name":"fsaRentedOccupiedCount.csv","type":"text/csv","lastModified":1713187508064.833,"size":55532},{"id":"9e20159c640c0d47105cf840e028eb0d51c4b561f6a3fed99ff7806c2a5865f6163b7fecf5a1ab14094d55c87f5a77150299132193f5d8a7fe8e46473977ab6e","href":"https://static.observableusercontent.com/files/9e20159c640c0d47105cf840e028eb0d51c4b561f6a3fed99ff7806c2a5865f6163b7fecf5a1ab14094d55c87f5a77150299132193f5d8a7fe8e46473977ab6e","name":"fsaHouseholdOccupiedTotalCount.csv","type":"text/csv","lastModified":1713187666219.025,"size":58839},{"id":"a9249ddbb99f73128bc7d690f210a0fec69e94ba2b2593badf34a0450a3817da952e632f83fb05b03f781ea4d166b9f17d748d0dd3a227d6b04c774e8cf7ed34","href":"https://static.observableusercontent.com/files/a9249ddbb99f73128bc7d690f210a0fec69e94ba2b2593badf34a0450a3817da952e632f83fb05b03f781ea4d166b9f17d748d0dd3a227d6b04c774e8cf7ed34","name":"fsaVacancy.csv","type":"text/csv","lastModified":1713191263591.039,"size":42284},{"id":"e5fab90f7805fe266f3cf43d22cee54ce1bbe31831ab6611cb8d7374e3d873f52bf4b1e8fa7d0a8124b3f29e9553b4e25a07cb2e59e0d90a0c805d5846dd8d49","href":"https://static.observableusercontent.com/files/e5fab90f7805fe266f3cf43d22cee54ce1bbe31831ab6611cb8d7374e3d873f52bf4b1e8fa7d0a8124b3f29e9553b4e25a07cb2e59e0d90a0c805d5846dd8d49","name":"Provinces rent and wages.csv","type":"text/csv","lastModified":1713283041156.314,"size":2940},{"id":"4604fbde6ccfee815cf882e4884478e485d7177b94d2801b6f39d4824d995d158be99a7b6227c452ed96c3500a6b12e0b7b69513c5f6caa2b1f2b30c00d364fa","href":"https://static.observableusercontent.com/files/4604fbde6ccfee815cf882e4884478e485d7177b94d2801b6f39d4824d995d158be99a7b6227c452ed96c3500a6b12e0b7b69513c5f6caa2b1f2b30c00d364fa","name":"fsaGeoIntersect@1.json","type":"application/json","lastModified":1713792538380.176,"size":1010764},{"id":"1bea6f5e5e9de313c28cfd95ee0b9bbaae55a939da1a5eef8790d0a9da54aac3b9336bd3f50f00eb94332a477422e7a8f68a119287b4fcefd956404097a2f4a0","href":"https://static.observableusercontent.com/files/1bea6f5e5e9de313c28cfd95ee0b9bbaae55a939da1a5eef8790d0a9da54aac3b9336bd3f50f00eb94332a477422e7a8f68a119287b4fcefd956404097a2f4a0","name":"medianIncomeRentersCMA.csv","type":"text/csv","lastModified":1713289149254.615,"size":2184},{"id":"6403ea305fe24d55425f576ff2cdb9658c5afcc63da8961d920c7f47c7b8b8d55153bf04ff8f9e6b2f15ed5ca2aecd62e593882ed722063e3e87d164b3a2830e","href":"https://static.observableusercontent.com/files/6403ea305fe24d55425f576ff2cdb9658c5afcc63da8961d920c7f47c7b8b8d55153bf04ff8f9e6b2f15ed5ca2aecd62e593882ed722063e3e87d164b3a2830e","name":"fsaPercDiffOccupiedVacant@1.csv","type":"text/csv","lastModified":1715008424892.025,"size":45383}] 2d:{"id":"16d0677780bb92e2","slug":"where-can-i-afford-to-rent","title":"Where can I afford to rent?","thumbnail":"29091f356e4d363f05a10c47ee7311b2e41165998829082a3249e6e6b88098ce","access_level":"public","create_time":"$D2024-04-15T12:25:58.939Z","update_time":"$D2024-09-12T16:26:27.274Z","view_time":null,"first_public_time":"$D2024-06-11T11:47:44.895Z","has_unpublished_edits":null,"fork":false,"stars":4,"starred":false,"owner":{"type":"team","id":"0fe3b933647fb61f","login":"nshiab","name":"Naël Shiab","avatar_url":"https://avatars-next.observableusercontent.com/31f810f6b0b585b397a840bca419abec764dea4c181c2f7bff37141afa2814a6","tier":"starter_2024"},"version":1095,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"c1a406ad24d83947","login":"nshiab","name":"Naël Shiab","avatar_url":"https://avatars-next.observableusercontent.com/31f810f6b0b585b397a840bca419abec764dea4c181c2f7bff37141afa2814a6","tier":null}],"members":[{"type":"team","id":"0fe3b933647fb61f","login":"nshiab","name":"Naël Shiab","avatar_url":"https://avatars-next.observableusercontent.com/31f810f6b0b585b397a840bca419abec764dea4c181c2f7bff37141afa2814a6","tier":"starter_2024","role":"editor"},{"type":"individual","id":"c1a406ad24d83947","login":"nshiab","name":"Naël Shiab","avatar_url":"https://avatars-next.observableusercontent.com/31f810f6b0b585b397a840bca419abec764dea4c181c2f7bff37141afa2814a6","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Where can I afford to rent?","cells":[{"id":0,"value":"# Where can I afford to rent?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":983,"value":"For the detailed methodology, [scroll down](#cell-9).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":820,"value":"### Summary of findings","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":963,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":100,"value":"# Interactive","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":486,"value":"## Provinces overview","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":491,"value":"viewof province = Inputs.select(provinces, {\n label: \"Select a province\",\n value: \"Ontario\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":990,"value":"provinceDescription(province, provincesData)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":516,"value":"makeProvinceOverviewChart(province, provincesData)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":483,"value":"## How many available homes could you afford to rent?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":102,"value":"viewof cma = Inputs.select(cmas, {\n label: \"Select a metropolitan area\",\n value: \"Toronto\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"viewof bedrooms = Inputs.select(\n [\n \"Bachelor\",\n \"One-bedroom\",\n \"Two-bedroom\",\n \"Three-bedroom\",\n \"Four-bedroom or bigger\"\n ],\n { label: \"What are you looking for?\", value: \"Two-bedroom\" }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":106,"value":"viewof annualIncome = Inputs.range([0, 300_000], {\n label: \"What's your household annual income before tax?\",\n step: 1,\n value: 75_000\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":151,"value":"Neighbourhoods with an average shelter cost **above ${j.formatNumber(userData.affordableThreshold, {prefix: \"$\"})}** for vacant units are considered **unaffordable** for you. Shelter costs include rent and other services (water, electricity, etc.).\n\nOut of **${userData.computedFSAs.length}** neighbourhoods in ${cma},** ${userData.affordableFSAsWithAtLeastOneVacant.length} (${j.formatNumber(userData.affordableFSAsWithAtLeastOneVacant.length / userData.computedFSAs.length * 100, {suffix: \"%\", significantDigits: 2})})** are affordable for you and have at least one vacant ${bedrooms.toLowerCase()} home.\n\nAccording to our estimates there are **${j.formatNumber(userData.affordableAndVacantBedrooms)}** potentially available to rent ${bedrooms.toLowerCase()} homes in neighbourhoods you could afford in ${cma}. That's **${userData.percAffordableAndVacantBedrooms}** of all ${bedrooms.toLowerCase()} homes rentals.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":332,"value":"{\n const sankeyData = getSankeyData(userData, bedrooms);\n return makeSankeyChart(sankeyData);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":341,"value":"## Where are the vacant and affordable homes for you?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":456,"value":"mapLegend = md`Hover on the map to get more information on vacant ${bedrooms.toLowerCase()} homes.\n\nThere’s a greater chance you’ll find available and affordable homes in ${highlight(\n \"yellow neighbourhoods\",\n \"yellow\",\n \"black\"\n)}. The ${highlight(\n \"purple neighbourhoods\",\n \"purple\",\n \"white\"\n)} are affordable but don't have many vacancies. The ${highlight(\n \"red neighbourhoods\",\n \"red\",\n \"white\"\n)} are too expensive.\n\nIn many neighbourhoods, the rent of vacant units is higher than that of already occupied units, and our estimates take this into account.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":346,"value":"map = {\n const container = yield html`\n

\n \n

`;\n\n const map = makeMap(container, userData, FSAsGeoInstersect);\n\n invalidation.then(() => map.remove());\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":525,"value":"## What about other metropolitan areas?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":541,"value":"Out of **${j.formatNumber(userData.computedFSAsOverview.length)}** neighbourhoods, **${j.formatNumber(userData.affordableFSAsWithAtLeastOneVacantOverview.length)} (${j.formatNumber(userData.affordableFSAsWithAtLeastOneVacantOverview.length / userData.computedFSAsOverview.length * 100, {significantDigits: 2, suffix: \"%\"})})** are affordable and have at least one vacant ${bedrooms.toLocaleLowerCase()} home.\n\nAccording to our estimates there are **${j.formatNumber(userData.affordableAndVacantBedroomsOverview)} ${bedrooms.toLocaleLowerCase()}** homes potentially available to rent in neighbourhoods you could afford across all metropolitan areas, out of **${j.formatNumber(userData.rentersTotalCountBedroomsOverview)}**. That's **${j.formatNumber(userData.affordableAndVacantBedroomsOverview / userData.rentersTotalCountBedroomsOverview * 100, {suffix: \"%\", significantDigits: 2})}** of all ${bedrooms.toLocaleLowerCase()} rentals.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":588,"value":"viewof overviewVariable = Inputs.radio([\"Percentage\", \"Count\"], {\n label: \"How do you want to see the data?\",\n value: \"Percentage\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1010,"value":"#### ${overviewVariable === \"Percentage\" ? \"Percentage\" : \"Number\"} of vacant and affordable ${bedrooms.toLowerCase()} homes per metropolitan area","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":586,"value":"makeOverviewChart(userData, overviewVariable)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":608,"value":"## Personas\n\nCheck what's available for people living on minimum wage or households with a median income.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":615,"value":"viewof persona = Inputs.select(\n personas.map((d) => d.name),\n { label: \"Select a persona\" }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":619,"value":"viewof bedroomsPersona = Inputs.select(\n [\n \"Bachelor\",\n \"One-bedroom\",\n \"Two-bedroom\",\n \"Three-bedroom\",\n \"Four-bedroom or bigger\",\n \"All\"\n ],\n { label: \"How many bedrooms?\", value: \"Two-bedroom\" }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":748,"value":"According to our estimates there are **${j.formatNumber(personaData.affordableAndVacantToRentCountBedrooms)}** ${bedroomsPersona.toLowerCase()} homes potentially available to rent in neighbourhoods this persona could afford across all metropolitan areas. That's **${j.formatNumber(personaData.affordableAndVacantToRentCountBedrooms / personaData.rentersTotalCountBedrooms * 100, {significantDigits: 2, suffix: \"%\"})}** of all ${bedroomsPersona.toLowerCase()} rentals.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":622,"value":"viewof personaVariable = Inputs.radio([\"Percentage\", \"Count\"], {\n label: \"How do you want to see the data?\",\n value: \"Percentage\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":755,"value":"makeOverviewChart(personaData, personaVariable)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"# Methodology","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":763,"value":"## Context\n\nThe goal of this project is to give Canadians a concrete answer to this question:\n- _Where can I afford to rent in Canada?_\n\nTo answer this question, we ask users for their household annual income before tax and estimate the number of affordable and available homes in metropolitan areas.\n\nIn our project, affordable means that shelter costs are less than 30% of the pre-tax income. [Statistics Canada uses the same definition](https://www12.statcan.gc.ca/census-recensement/2021/as-sa/98-200-X/2021016/98-200-X2021016-eng.cfm#:~:text=Unaffordable%20housing%20refers%20to%20situations%20where%20more%20than%2030%25%20of%20pre%2Dtax%20household%20income%20is%20spent%20on%20shelter%20costs.).\n\nWe focus on rentals.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":765,"value":"## Data\n\n### Shelter costs per FSA\n\nWe purchased a custom tabulation of the **2021 Census** from **Statistics Canada**. For each Forward Sortation Area (first three characters of postal codes), which we call _neighbourhoods_ in this analysis, we got the **average monthly shelter cost** and **rent**. We also received many other variables, but we focus on these two.\n\nAll of this data is broken down per number of bedrooms. For example, here's the data for a rented two-bedroom home in the H4G area (Montreal):\n- Average monthly shelter cost: $959\n- Average monthly rent: $864\n\nWe created a new variable, **other costs**, by subtracting the rent from the shelter cost.\n\nIn our example, this gives us:\n- Average monthly other costs: $95","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":770,"value":"### Adjusting to inflation\n\nWe adjusted the values to inflation because prices and costs have changed significantly since 2021.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":774,"value":"$30","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":786,"value":"#### Other costs\n\nFor the **other costs**, we used the **[Consumer Price Index, monthly, not seasonally adjusted](https://www150.statcan.gc.ca/t1/tbl1/en/tv.action?pid=1810000401)**. We calculated and applied the inflation from the _Water, fuel and electricity_ category, under _Shelter_, since the other costs cover mainly these expenses for renters.\n\nWhen the CPI was available at the CMA level, we used it. Otherwise, we used the province-wide number.\n\nWe adjusted the costs to October 2023 dollars because the latest CMHC data is from October 2023.\n\nFor example, for our two-bedroom home in the H4G area, this gives us:\n- a CPI of 128 in May 2021 (Census date) and 142 in October 2023 in Montreal\n- which translates to an inflation rate of 10.9%\n- which adjusts our other costs from $95 to $105","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":788,"value":"$31","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1036,"value":"Here's the detailed data per CMA. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1040,"value":"Inputs.table(dataFSAs.percDiffOccupiedVacant)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":792,"value":"### Adjusted shelter cost\n\nWe can now sum up our adjusted **rent** and adjusted **other costs** to get our adjusted **shelter cost**.\n\nFor example, for our two-bedroom home in the H4G area:\n- The adjusted rent is $1,638\n- The adjusted other costs are $105\n- So our adjusted shelter cost is $1,743","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":796,"value":"$32","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":802,"value":"### Map\n\nSome FSAs on the outskirts of the CMAs go pretty far into rural areas. We clipped them with CMHC zones. This assumes that the rural areas have a low population and that the clipping has a minimal impact on the overall trends.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":806,"value":"$33","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":809,"value":"### Minimum wages\n\nThe data comes from the [Minimum Wage Database](https://srv116.services.gc.ca/dimt-wid/sm-mw/rpt1.aspx). We retrieved the minimum wage for each province in 2023.\n\nThe annual income is the minimum wage multiplied by 40 hours a week multiplied by 52 weeks.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":814,"value":"### Provinces data\n\nThe data has been compiled into this [spreadsheet](https://docs.google.com/spreadsheets/d/1bVk7oKlO3xr4QijDRQNgHMAbIiqGowl2iqbrZBCTv8c/edit) (not public).\n\n#### Vacancy rates and average rents\n\nThe data come from the Canada Mortgage and Housing Corporation provincial ([Rental Market Survey Data Tables from 2018 to 2023](https://www.cmhc-schl.gc.ca/professionals/housing-markets-data-and-research/housing-data/data-tables/rental-market/rental-market-report-data-tables)).\n\n#### Average wages\n\nThe average hourly wages per province comes from [Statistics Canada](https://www150.statcan.gc.ca/t1/tbl1/en/cv.action?pid=1410006401).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":12,"value":"# Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":91,"value":"### Raw data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":39,"value":"dataFSAs = ({\n rentOccupied: await FileAttachment(\"fsaRentOccupied.csv\").csv({\n typed: true\n }),\n otherCosts: await FileAttachment(\"fsaOtherCosts.csv\").csv({ typed: true }),\n totalOccupiedCount: await FileAttachment(\n \"fsaHouseholdOccupiedTotalCount.csv\"\n ).csv({\n typed: true\n }),\n rentersOccupiedCount: await FileAttachment(\"fsaRentedOccupiedCount.csv\").csv({\n typed: true\n }),\n vacancyRates: await FileAttachment(\"fsaVacancy.csv\").csv({\n typed: true\n }),\n percDiffOccupiedVacant: await FileAttachment(\n \"fsaPercDiffOccupiedVacant@1.csv\"\n ).csv({ typed: true })\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":499,"value":"provincesData = FileAttachment(\"Provinces rent and wages.csv\").csv({\n typed: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":371,"value":"FSAsGeoInstersect = FileAttachment(\"fsaGeoIntersect@1.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"### Computed data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":110,"value":"cmas = Array.from(new Set(dataFSAs.rentOccupied.map((d) => d.cma))).sort(\n (a, b) => (a < b ? -1 : 1)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":502,"value":"provinces = Array.from(new Set(provincesData.map((d) => d.Geography)))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":122,"value":"userData = getUserData(bedrooms, annualIncome, dataFSAs, cma)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":611,"value":"### Personas data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":613,"value":"personas = [\n // Minimum wage\n {\n name: \"One minimum salary (province)\",\n income: \"Minimum wage\"\n },\n {\n name: \"Two minimum salaries (province)\",\n income: \"Minimum wage\"\n },\n {\n name: \"Median household income (renters, CMA)\",\n income: \"Median income\"\n },\n {\n name: \"Median household income (renters, Canada)\",\n income: \"Median income\"\n },\n {\n name: \"Median household income (overall, Canada)\",\n income: \"Median income\"\n },\n {\n name: \"Median individual income (overall, Canada)\",\n income: \"Median income\"\n },\n {\n name: \"Median family income (renters, Canada)\",\n income: \"Median income\"\n },\n {\n name: \"Median lone-parent income (renters, Canada)\",\n income: \"Median income\"\n }\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":695,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":723,"value":"personaData = getPersonaData(\n dataFSAs,\n persona,\n personas,\n personaIncomes,\n bedroomsPersona\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":838,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":889,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":901,"value":"minimumWageWorkersData = {\n const bachelorBedrooms = getPersonaData(\n dataFSAs,\n \"One minimum salary (province)\",\n personas,\n personaIncomes,\n \"Bachelor\"\n );\n\n const oneBedrooms = getPersonaData(\n dataFSAs,\n \"One minimum salary (province)\",\n personas,\n personaIncomes,\n \"One-bedroom\"\n );\n\n const totalVacantAndAffordable =\n bachelorBedrooms.affordableAndVacantToRentCountBedrooms +\n oneBedrooms.affordableAndVacantToRentCountBedrooms;\n\n const totalBedroomsToRent =\n bachelorBedrooms.rentersTotalCountBedrooms +\n oneBedrooms.rentersTotalCountBedrooms;\n\n return {\n totalVacantAndAffordable,\n totalBedroomsToRent,\n perc: (totalVacantAndAffordable / totalBedroomsToRent) * 100\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"# Functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":349,"value":"### Data computations","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":19,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":629,"value":"function getAffordableFSAsWithAtLeastOneVacant(computedData) {\n return computedData.filter(\n (d) =>\n d.affordableFSA === true && d.affordableAndVacantToRentCountBedrooms >= 1\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":633,"value":"function getTotalOccupiedCountAllOverview(computedData) {\n return computedData.reduce((acc, d) => (acc += d.totalOccupiedCountAll), 0);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":636,"value":"function getTotalOccupiedCountBedrooms(computedData) {\n return computedData.reduce(\n (acc, d) => (acc += d.totalOccupiedCountBedrooms),\n 0\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":639,"value":"function getRentersTotalCountBedrooms(computedData) {\n return computedData.reduce(\n (acc, d) => (acc += d.rentersTotalCountBedrooms),\n 0\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":642,"value":"function getRentersVacantCountBedrooms(computedData) {\n return computedData.reduce(\n (acc, d) => (acc += d.rentersVacantCountBedrooms),\n 0\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":645,"value":"function getAffordableAndVacantBedrooms(computedData) {\n return computedData\n .filter((d) => d.affordableAndVacantToRentCountBedrooms > 0)\n .reduce((acc, d) => (acc += d.affordableAndVacantToRentCountBedrooms), 0);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":336,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":654,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":213,"value":"### Charts and maps","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":511,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":220,"value":"$3b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":215,"value":"$3c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":950,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":358,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":559,"value":"$3f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":458,"value":"### Others","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":994,"value":"$40","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":459,"value":"function highlight(string, color, textColor) {\n return `${string}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"# Libraries","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":23,"value":"j = require(\"journalism@1.15.4\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":217,"value":"d3Sankey = require(\"d3-sankey@0.12.3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":360,"value":"turf = require(\"@turf/turf@7.1.0\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":362,"value":"maplibregl = require(\"maplibre-gl@4.7.0\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W41","stdlib":"1","titling":"auto"}} 2e:"$2d:body"