25:["$","title",null,{"children":"The Masterplan | Francisco Dans | Observable"}] 4b:T503,{ const _ = await require('lodash'); const margin = ({top: 20, right: 0, bottom: 30, left: 40}) const moneyAfterRentByCity = _.sortBy(_.map(cities, (city, name) => [name, salaryBands[city.band]*(1-city.taxes)/12 - city.rent]), (v) => v[1]); const svg = d3.select(DOM.svg(width, 500)) const x = d3.scaleBand() .domain(moneyAfterRentByCity.map(d => capitalize(d[0]))) .range([margin.left, width - margin.right]) .padding(0.1); const xAxis = g => g .attr("transform", `translate(0,${500 - margin.bottom})`) .call(d3.axisBottom(x) .tickSizeOuter(0)) const yAxis = g => g .attr("transform", `translate(${margin.left},0)`) .call(d3.axisLeft(y)) .call(g => g.select(".domain").remove()) const y = d3.scaleLinear() .domain([0, d3.max(moneyAfterRentByCity, d => d[1])]).nice() .range([500 - margin.bottom, margin.top]) svg.append('g') .attr("fill", "steelblue") .selectAll('rect').data(moneyAfterRentByCity).enter().append('rect') .attr('x', d => x(capitalize(d[0]))) .attr('y', d => y(d[1])) .attr("height", d => y(0) - y(d[1])) .attr("width", x.bandwidth()); svg.append("g") .call(xAxis); svg.append("g") .call(yAxis); return svg.node(); }4c:[] 47:{"id":"04e7e659efd17a8e","slug":"the-masterplan","title":"The Masterplan","thumbnail":"110619dd07de8c2ef3a14e05a07eafc7ac11abd9fe93ac92e8812a446115860e","access_level":"public","create_time":"$D2018-03-11T16:58:40.664Z","update_time":"$D2020-01-07T10:17:19.721Z","view_time":null,"first_public_time":"$D2018-03-11T19:44:15.601Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"b2102c76b4af6c2e","login":"fdansv","name":"Francisco Dans","avatar_url":"https://avatars-next.observableusercontent.com/f12d87eca39e76a793edc5b7fba7c134b9f11f04ee6dc997c95b6099fd09b922","tier":"starter_2024","bio":"We can overcome this with the power of friendship!","followed_by_you":false,"follows_you":false},"version":255,"publish_version":255,"role":null,"authored":false,"authors":[{"type":"individual","id":"fe411abfc27d1f4e","login":"fdansv","name":"Francisco Dans","avatar_url":"https://avatars-next.observableusercontent.com/f12d87eca39e76a793edc5b7fba7c134b9f11f04ee6dc997c95b6099fd09b922","tier":null,"bio":"We can overcome this with the power of friendship!","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"fe411abfc27d1f4e","login":"fdansv","name":"Francisco Dans","avatar_url":"https://avatars-next.observableusercontent.com/f12d87eca39e76a793edc5b7fba7c134b9f11f04ee6dc997c95b6099fd09b922","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"The Masterplan","cells":[{"id":0,"value":"md`# The Masterplan\n*A goal without a plan is just a wish*\n## Part A: finding out what we need`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"md`Let's take a look at the cities we may want to live in`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"html`\n ${Object.keys(cities).map((n) => `\n\t\n\t\n\t\n\t` )}\n

Name	Rent for 2br apartment	Need car?
${n.replace(/\\w\\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();})}	$${cities[n].rent}	${cities[n].car? 'Yes': 'No'}

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":159,"value":"md`And now let's select one to see how much would it cost us to live there`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":142,"value":"viewof currentCityName = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":162,"value":"currentCity = cities[currentCityName]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":164,"value":"salary = salaryBands[currentCity.band]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":170,"value":"monthlyNetSalary = salary * (1-currentCity.taxes)/12","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":177,"value":"md`We're using the lowest salary estimate of the band in order to be conservative when budgeting`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":173,"value":"salaryAfterRent = monthlyNetSalary - currentCity.rent","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":179,"value":"md`To calculate how much we need, we're taking into account:\n* Two months' worth of rent\n* One month car rental, if the city needs a car\n* Two plane tickets`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":140,"value":"totalEntryCost = {\n const ticketPrice = 1000\n return (currentCity.rent * 2) +\n (ticketPrice * 2) +\n (currentCity.car? 800: 0)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":186,"value":"euroRate = 0.81","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":185,"value":"totalEntryCostEuros = totalEntryCost * euroRate","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"md`## Part B: figuring out how to get there`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"currentNetMonthlySalary = 3600","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"monthlyExpenses = {\n const exp = {'rent': 636,\n 'bike': 230,\n 'insurance': 50,\n 'creditLine': 160,\n 'bikeParking': 30,\n 'internet': 45,\n 'phone': 30,\n 'elec': 100,\n };\n return Object.keys(exp).reduce((p,c) => {\n return p + exp[c];\n }, 0)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"monthlySpendable = currentNetMonthlySalary - monthlyExpenses","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"viewof dailyBudget= html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"viewof monthsToSave = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":60,"value":"md`Fran then lives on a daily budget of **€${dailyBudget}** for ${monthsToSave} months`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":66,"value":"departureMonth = [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\",\n\"July\", \"August\", \"September\", \"October\", \"November\", \"December\"][3 + monthsToSave]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"md `## If we aim to move out to the US in __${departureMonth}__, we'll have __€${(monthlySpendable - dailyBudget * 30) * monthsToSave}__ in total savings`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":198,"value":"md`Now, let's take into account Part A. If we're moving to **${capitalize(currentCityName)}** and we need **€${totalEntryCostEuros}**...`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":192,"value":"md `...with a daily budget of **€${dailyBudget}** we'll be able to move in **${[\"January\", \"February\", \"March\", \"April\", \"May\", \"June\",\n\"July\", \"August\", \"September\", \"October\", \"November\", \"December\"][3 + Math.ceil(totalEntryCostEuros/(monthlySpendable - dailyBudget*30))]}**`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":205,"value":"md `...if we want to be there by **${departureMonth}**, Fran should live with a daily budget of **€${(monthlySpendable - (totalEntryCostEuros / monthsToSave))/30}**`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":209,"value":"md`## Fun stuff\nBar chart of cities by money remaining after rent`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":229,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":219,"value":"d3 = require(\"https://d3js.org/d3.v5.min.js\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":224,"value":"cities = {return {\n 'los angeles': {\n band: 'sf-ny',\n rent: 2500,\n car: true,\n taxes: 0.19854 // California\n },\n 'san antonio': {\n band: 'metro',\n rent: 1200,\n car: true,\n taxes: 0.159443181818182 // Texas\n },\n 'new york': {\n band: 'sf-ny',\n rent: 3000,\n car: false,\n taxes: 0.23947 // New York\n },\n 'houston': {\n band: 'metro',\n rent: 1800,\n car: true,\n taxes: 0.159443181818182 // Texas\n },\n 'portland': {\n band: 'metro',\n rent: 2000,\n car: false,\n taxes: 0.232318181818182 // Oregon\n },\n 'savannah': {\n band: 'nonmetro',\n rent: 1500,\n car: true,\n taxes: 0.209\n }\n}}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":227,"value":"salaryBands = {\n return {\n 'sf-ny': 100000,\n 'metro': 88000,\n 'nonmetro': 79000\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":243,"value":"capitalize = n => n.replace(/\\w\\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4c","stdlib":"1"}} 24:null