2c:null 2d:["$","title",null,{"children":"New York City Economy and Job Statistics | BetaNYC | Observable"}] 32:T5ad,# New York City Economy and Job Statistics Inspiration from [NYTimes](https://www.nytimes.com/2022/04/01/business/economy/jobs-report-march-2022.html) and [THE CITY](https://projects.thecity.nyc/hows-new-york-city-doing/index.html). Data from [NYS DOL](https://dol.ny.gov/labor-statistics-new-york-city-region), [StreetEasy](https://streeteasy.com/blog/data-dashboard), and [OpenTable](https://www.opentable.com/state-of-industry). - [Employment Statistics by Industry](https://dol.ny.gov/statistics-new-york-city-employment-statistics): This dataset is not seasonally adjusted, we used it since it provides the most up to date breakdowns by industries and various levels. For seasonally adjusted numbers use the NYS DOL's [Total NYC Nonfarm Jobs (Seasonally Adjusted)](https://dol.ny.gov/statistics-total-nyc-nonfarm-jobs-seasonally-adjusted) which only provides a general Non-farm jobs number, or NYC OMB's [NYC Employment Data](https://www.nyc.gov/site/omb/publications/publications.page) which provides information on 27 key industries. - [New York City Labor Force Data](https://dol.ny.gov/statistics-new-york-city-labor-force-data) - [Seasonally adjusted LAUS data](https://dol.ny.gov/statistics-laussaxls) - [NYC Average Weekly Earnings of All Employees](https://dol.ny.gov/statistics-state-and-area-employment-hours-and-earnings) Download processed data [here](https://github.com/zhik/nyc_stats). Subscribe to updates via email here. ---33:T810,{ const key_industries = [ { industry: "Total Nonfarm", label: "main" }, { industry: "Service-Providing", label: "" }, { industry: "Construction of Buildings", label: "" }, { industry: "Trade, Transportation, and Utilities", label: "" }, { industry: "Financial Activities", label: "" }, { industry: "Real Estate", label: "" }, { industry: "Professional and Business Services", label: "" }, { industry: "Educational Services", label: "" }, { industry: "Health Care and Social Assistance", label: "" }, { industry: "Hospitals", label: "" }, { industry: "Arts, Entertainment, and Recreation Jobs", label: "" }, { industry: "Accommodation", label: "" }, { industry: "Food Services and Drinking Places", label: "" }, { industry: "Government", label: "" } ]; const key_names = key_industries.map((i) => i.industry); const data = table_2.filter(({ name }) => key_names.includes(name)); const format = (int) => d3.format(".2f")(int) + "%"; return Plot.plot({ width, marginLeft: 100, height: data.length * 30, x: { label: "Percent change since " + comp_year, axis: "top", grid: true }, y: { axis: null, domain: d3.sort(data, (d) => -1 * d.change_pre_pand).map((d) => d.name) }, marks: [ Plot.barX(data, { x1: 0, x2: "change_pre_pand", fill: (d) => (d.change_pre_pand > 0 ? "steelblue" : "#e15759"), y: "name", title: (d) => `Change from ${comp_year}: ${format( d.change_pre_pand )} \nChange from Last Year: ${format(d.change_ytd)}` }), Plot.text( data.filter((d) => d.change_pre_pand < 0), { x: 0, y: "name", text: "name", textAnchor: "start", dx: 1 } ), Plot.text( data.filter((d) => d.change_pre_pand > 0), { x: 0, y: "name", text: "name", textAnchor: "end", dx: -3 } ) ] }); }34:T41a,viewof selectedInd = { const table = Inputs.table(search, { multiple: false, format: { name: (x, i, r) => { const { name, seriesCode } = r[i]; const zeros = String(seriesCode).split("").reverse().slice(0, 8); const firstNotZeroIndex = zeros.findIndex((i) => i !== "0"); //case for non-farm if (seriesCode === 0) return name; return "-".repeat(8 - firstNotZeroIndex) + name; }, //add indent seriesCode: (x) => String(x), change_mtd: changeSparkbar(d3.extent(table_2, (d) => d.change_mtd)), change_ytd: changeSparkbar(d3.extent(table_2, (d) => d.change_ytd)), change_pre_pand: changeSparkbar( d3.extent(table_2, (d) => d.change_pre_pand) ) }, header: { name: "Industry", seriesCode: "Series Code", latest: `Jobs in ${formatMonthYear(nychist_latest_month)} (thous.)`, change_mtd: "% Chg (Month)", change_ytd: "% Chg (Year)", change_pre_pand: `% Chg since ${comp_year}` } }); return table; }35:T445,{ const parseTime = d3.timeParse("%b %y"); const selectedRow = selectedInd ? table_1.find((row) => row.seriesCode === selectedInd.seriesCode) : table_1[0]; const data = selectedRow.data .filter(({ date }) => ["19", "20", "21", "22"].includes(date.slice(4))) .map((row) => { row.modDate = parseTime(row.date); return row; }) .sort((a, b) => a.modDate - b.modDate); return Plot.plot({ y: { label: "↑ Jobs (Thousands)", grid: true }, x: { type: "time", label: null, ticks: 30, tickFormat: (d) => d.getMonth() === 0 ? d3.timeFormat("%Y")(d) : d.getMonth() % 2 === 0 ? d3.timeFormat("%b")(d) : "" }, width, marks: [ Plot.areaY(data, { x: "modDate", y: "value", fill: "steelblue", curve: "step-before", fillOpacity: 0.6 }), Plot.lineY(data, { x: "modDate", y: "value", curve: "step-before", strokeWidth: 0.5 }), Plot.ruleY([0]) ] }); }36:T744,{ const parseTime = d3.timeParse("%b %y"); const selectedRow = selectedInd ? table_1.find((row) => row.seriesCode === selectedInd.seriesCode) : table_1[0]; const timeframe_data = selectedRow.data.filter(({ date }) => ["20", "21", "22"].includes(date.slice(4)) ); const feb20_baseline = timeframe_data.find( ({ date }) => date === "Feb 20" )?.value; const data = timeframe_data .map((row) => { row.modDate = parseTime(row.date); row.baselineDiff = row.value - feb20_baseline; return row; }) .sort((a, b) => a.modDate - b.modDate); return Plot.plot({ y: { label: `${feb20_baseline} thousand jobs in Feb 2020`, grid: true, tickFormat: (d, i, r) => { if (i === r.length - 2) { return d + " thous."; } return d; } }, x: { type: "time", label: null, ticks: 20, tickFormat: (d) => d.getMonth() === 0 ? d3.timeFormat("%Y")(d) : d.getMonth() % 2 === 0 ? d3.timeFormat("%b")(d) : "" }, width, height: 600, marginLeft: 80, marginRight: 100, marks: [ Plot.areaY(data, { x: "modDate", y: "baselineDiff", fill: "tomato", curve: "step-before", fillOpacity: 0.6 }), Plot.lineY(data, { x: "modDate", y: "baselineDiff", curve: "step-before", strokeWidth: 0.5 }), Plot.text( data, Plot.selectLast({ x: "modDate", y: (d) => d.baselineDiff / 2, text: (d) => `${d.baselineDiff > 0 ? "+" : "-"}${d3.format(".0f")( d.baselineDiff )} thous. jobs\n since Feb 2020`, textAnchor: "start", dx: 3 }) ), Plot.ruleY([0]) ] }); }37:T489,unemployed = Plot.plot({ width, marginBottom: 40, y: { grid: true }, x: { type: "time", ticks: 50, tickFormat: (d) => d.getMonth() === 0 ? d3.timeFormat("%Y")(d) : d.getMonth() % 2 === 0 ? d3.timeFormat("%b")(d) : "" }, marks: [ Plot.line( laus_sa_city.filter(({ YEAR }) => new Date(YEAR).getFullYear() >= 2019), { x: "YEAR", y: "Unemployment Rate", stroke: "steelblue" } ), Plot.dot( laus_sa_city.filter(({ YEAR }) => new Date(YEAR).getFullYear() >= 2019), { x: "YEAR", y: "Unemployment Rate", r: 2, fill: "steelblue" } ), Plot.dot( laus_sa_city.filter(({ YEAR }) => new Date(YEAR).getFullYear() >= 2019), { x: "YEAR", y: "Unemployment Rate", r: 4, fill: "rgba(0,0,0,0)", title: (d) => `${d.YEAR.toLocaleDateString()} : ${d["Unemployment Rate"]}%` } ), Plot.line( laus_sa_state.filter(({ YEAR }) => new Date(YEAR).getFullYear() >= 2019), { x: "YEAR", y: "Unemployment Rate", stroke: "tomato" } ), Plot.ruleY([0]) ] })38:Tb20,{ const container = html`

`; const height = 350; const svg = d3 .select(container) .append("svg") .attr("viewBox", [0, 0, width, height]); const div = d3.select(container).append("div").classed("tooltip", true); const tooltip = new Tooltip(div); function tooltipContents(d) { const neighb = d.properties.name; const find = latest_rent_data.find((i) => d.properties.name === i.areaName); mutable clicked_neibh = d.properties.name; if (find) { return `

${neighb}

Median Asking Rent: $${d3.format(",")( find.value )}

`; } else { return `

${neighb}

No data

`; } } const projection = d3 .geoMercator() .rotate([0, -65, 0]) .fitExtent( [ [20, 20], [width, height] ], boros.features.filter((i) => i.properties.Borough === "Manhattan")[0] ); const path = d3.geoPath(projection); const g = svg.append("g"); const neighbs_paths = g .selectAll(".neighb") .data(neighbs.features) .enter() .append("path") .classed("neighb", true) .attr("d", path) .attr("stroke", "white") .attr("stroke-width", 0.4) .attr("fill", (d) => { //fill with the most recent data const find = latest_rent_data.find( (i) => d.properties.name === i.areaName ); if (find) { return rent_color_scale(find.value); } return "#E9E9E9"; }); const neighbs_hover = g .selectAll(".neighb_hover") .data(neighbs.features.filter((i) => i.properties.Borough === "Manhattan")) .enter() .append("path") .classed("neighb_hover", true) .attr("d", path) .attr("stroke", "white") .attr("stroke-width", 0.4) .attr("fill", "rgba(255, 255, 255, 0)") .on("mouseover", function (event, d) { tooltip.display(d, tooltipContents); d3.select(this).style("stroke", "black").style("stroke-width", 1.5); }) .on("mouseout", function () { tooltip.hide(); d3.select(this).style("stroke", "black").style("stroke-width", 0); }) .on("mousemove", (event) => { tooltip.move(event); }); const boros_paths = g .selectAll(".boro") .data(boros.features) .enter() .append("path") .classed("boro", true) .attr("d", path) .attr("stroke", "black") .attr("stroke-width", 0.4) .attr("fill", "none"); return container; }39:T4af,{ const data = mn_median_asking_rent .filter((i) => i.date.getFullYear() >= 2019) .map((i) => { //reclass i.name = [clicked_neibh, "Manhattan"].includes(i.areaName) ? i.areaName : "Others"; return i; }); return Plot.plot({ width, marginRight: 100, color: { domain: [clicked_neibh, "Manhattan", "Others"], range: ["steelblue", "orange", "rgba(155,155,155,0.15)"] }, x: { type: "time", ticks: 10, tickFormat: (d) => d.getMonth() === 0 ? d3.timeFormat("%Y")(d) : d.getMonth() % 2 === 0 ? d3.timeFormat("%b")(d) : "" }, y: { label: "↑ Median Asking Rent ($)", grid: true }, marks: [ Plot.line(data, { x: "date", y: "value", z: "areaName", stroke: (d) => d.name, title: "areaName" }), Plot.text( data, Plot.selectLast({ x: "date", y: "value", fill: "name", z: "areaName", text: (d) => (d.name !== "Others" ? d.name : ""), textAnchor: "start", dx: 3 }) ) ] }); }3a:T9b5,seated = { const lines = [ Plot.line( seated_data.filter(({ date }) => { const year = new Date(date).getFullYear(); return year >= 2016 && year < 2023; }), { x: "date", y: "change", stroke: "lightblue" } ), Plot.dot( seated_data.filter(({ date }) => { const year = new Date(date).getFullYear(); return year >= 2016 && year < 2023; }), { x: "date", y: "change", r: 4, fill: "rgba(0,0,0,0)", title: (d) => `${d.date.toLocaleDateString("default", { weekday: "long", year: "numeric", month: "short", day: "numeric" })} : ${d.change}%` } ), Plot.line( seated_data.filter(({ date }) => { const year = new Date(date).getFullYear(); return year === 2023; }), { x: "date", y: "change", stroke: "steelblue" } ), Plot.dot( seated_data.filter(({ date }) => { const year = new Date(date).getFullYear(); return year === 2023; }), { x: "date", y: "change", r: 4, fill: "rgba(0,0,0,0)", title: (d) => `${d.date.toLocaleDateString("default", { weekday: "long", year: "numeric", month: "short", day: "numeric" })} : ${d.change}%` } ) ]; return Plot.plot({ width, marginBottom: 40, marginRight: 100, // facet: { // data: seated_data, // y: "year", // axis: true // }, y: { label: "↑ %Change", domain: [-100, 100], grid: true }, x: { type: "time", sorted: true, tickFormat: (d) => d.getMonth() === 0 ? d3.timeFormat("%Y")(d) : d.getMonth() % 2 === 0 ? d3.timeFormat("%b")(d) : "" }, marks: [ ...lines, Plot.text( seated_data .filter(({ date }) => new Date(date).getFullYear() === 2023) .slice(0), { x: "date", y: (d) => -10, text: ["2019 baseline"], dy: "1.2em", textAnchor: "end", dx: 3 } ), Plot.text(seated_data.slice(seated_data.length - 1), { x: "date", y: (d) => 0, text: ["2022 baseline"], dy: "1.2em", textAnchor: "start", dx: 3 }), Plot.ruleY([0]) ] }); }3b:T4a1,table_2 = { //calculate percent change since start pandemic, last year and last month; include numbers for this month, SERIESCODE for easy filters const formatTime = d3.timeFormat("%b %y"); const current = new Date(nychist_latest_month.getTime()); const month = current.getMonth(); const year = current.getFullYear(); const last_month = formatTime( new Date(nychist_latest_month.getTime()).setMonth(month - 1) ); const last_year = formatTime( new Date(nychist_latest_month.getTime()).setFullYear(year - 1) ); return table_1.map(({ name, seriesCode, data }) => { const latest = data.find( ({ date }) => date === formatTime(nychist_latest_month) )?.value; const mtd = data.find(({ date }) => date === last_month)?.value; const ytd = data.find(({ date }) => date === last_year)?.value; let pre_pand = []; pre_pand = data.find( ({ date }) => date === comp_year.replace("20", "") )?.value; return { name, seriesCode, latest, change_mtd: ((latest - mtd) / mtd) * 100, change_ytd: ((latest - ytd) / ytd) * 100, change_pre_pand: ((latest - pre_pand) / pre_pand) * 100 }; }); }3c:[{"id":"1e18da93a22c967e96498d85edc0612e76cb010220c763f023dedea6400ee6e2e700c4c25791a57566683930c1c7fa65bc725336bb999f29ae50f33d00c4ddc3","href":"https://static.observableusercontent.com/files/1e18da93a22c967e96498d85edc0612e76cb010220c763f023dedea6400ee6e2e700c4c25791a57566683930c1c7fa65bc725336bb999f29ae50f33d00c4ddc3","name":"boros.geojson","type":"application/geo+json","lastModified":1668024133807.271,"size":31399},{"id":"8c6f578679f2487833382ea6a7a52976ac75d163a31787c681f19ee807111890f79233d5ff2e7f7d2a30bb0c2985f935417d8540178b0ab830f86db2411bc747","href":"https://static.observableusercontent.com/files/8c6f578679f2487833382ea6a7a52976ac75d163a31787c681f19ee807111890f79233d5ff2e7f7d2a30bb0c2985f935417d8540178b0ab830f86db2411bc747","name":"neighbs@3.geojson","type":"application/geo+json","lastModified":1672851522565.049,"size":262995}] 30:{"id":"01fd582f500d67db","slug":"new-york-city-employment-and-industry-statistics","title":"New York City Economy and Job Statistics","thumbnail":"640d27e569deb9158c9aa7b0ac3fc1b60695f3a4aaaf70d226e04b7e61e4215c","access_level":"public","create_time":"$D2022-10-09T23:45:48.133Z","update_time":"$D2023-05-16T15:21:43.838Z","view_time":null,"first_public_time":"$D2022-10-10T04:29:58.363Z","fork":false,"stars":2,"starred":false,"owner":{"type":"team","id":"6056c9907da84bd4","login":"betanyc","name":"BetaNYC","avatar_url":"https://avatars-next.observableusercontent.com/8e6d78f21df3c658c180a93a099938214f753f20e2bc46f10a162c9d35e419d1","tier":"pro_2024"},"version":1782,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"215e59083f0e53f8","login":"zhik","name":"Zhi Keng He","avatar_url":"https://avatars-next.observableusercontent.com/1921c3cb8ffa82cde953aa4417dc8b601dbd05384629c1f8ecf0544be068a204","tier":null}],"members":[{"type":"team","id":"6056c9907da84bd4","login":"betanyc","name":"BetaNYC","avatar_url":"https://avatars-next.observableusercontent.com/8e6d78f21df3c658c180a93a099938214f753f20e2bc46f10a162c9d35e419d1","tier":"pro_2024","role":"editor"}],"comments":[{"id":"964eb69f778fc2ba","reply_to_id":null,"content":"make areas positive blue?","create_time":"$D2022-10-11T13:45:09.057Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"215e59083f0e53f8","login":"zhik","name":"Zhi Keng He","avatar_url":"https://avatars-next.observableusercontent.com/1921c3cb8ffa82cde953aa4417dc8b601dbd05384629c1f8ecf0544be068a204","tier":null}}],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"New York City Economy and Job Statistics","cells":[{"id":0,"value":"$32","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1420,"value":"## Jobs in Key Industries\n*Not seasonally adjusted*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1464,"value":"//add button to compare pre-pand vs last year\nviewof comp_year = Inputs.radio(\n [\n nychist_last_year,\n \"Feb 2020\",\n `${nychist_latest_month.toLocaleDateString(\"en-US\", {\n month: \"short\"\n })} 2019`\n ],\n {\n label: \"Compare with ...\",\n value: `${nychist_latest_month.toLocaleDateString(\"en-US\", {\n month: \"short\"\n })} 2019`\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1347,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1664,"value":"*Search below for more details*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":281,"value":"viewof search = Inputs.search(table_2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":277,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":401,"value":"### NYC ${selectedInd ? selectedInd.name : table_2[0].name} Jobs since 2019\n*Not seasonally adjusted*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":288,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":415,"value":"### Recovery of **${selectedInd ? selectedInd.name : table_2[0].name}** jobs since before the pandemic in NYC\n*Not seasonally adjusted*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":445,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":664,"value":"### NYS/NYC Unemployment Rate since 2019 (Smoothed Seasonally Adjusted)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":890,"value":"Swatches(\n d3.scaleOrdinal([\"New York City\", \"NY State\"], [\"steelblue\", \"tomato\"])\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":615,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":938,"value":"### NYC Average Weekly Earnings of All Employees","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":941,"value":"earnings = Plot.plot({\n width,\n marginBottom: 40,\n y: {\n grid: true,\n domain: [1000, 1600]\n },\n x: {\n type: \"time\",\n tickFormat: (d) =>\n d.getMonth() === 0\n ? d3.timeFormat(\"%Y\")(d)\n : d.getMonth() % 2 === 0\n ? d3.timeFormat(\"%b\")(d)\n : \"\"\n },\n marks: [\n Plot.line(\n avg_weekly_earnings.filter(\n ({ date, value }) => new Date(date).getFullYear() >= 2016 && value\n ),\n { x: \"date\", y: \"value\", stroke: \"steelblue\" }\n ),\n Plot.dot(\n avg_weekly_earnings.filter(\n ({ date }) => new Date(date).getFullYear() >= 2016\n ),\n {\n x: \"date\",\n y: \"value\",\n r: 4,\n fill: \"rgba(0,0,0,0)\",\n title: (d) => `${d.date.toLocaleDateString()} : $${d.value}`\n }\n ),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1169,"value":"md`## StreetEasy: Median Asking Rent (${latest_date.toLocaleDateString(\n \"en-US\",\n {\n month: \"short\",\n year: \"numeric\"\n }\n)})\n*Hover over an area for more details*`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1065,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1175,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1232,"value":"## OpenTable: Restaurant seated diners\nfrom online, phone, and walk-in reservations\n\nDue to an update in the dashboard. Data before 2023 is compared to 2019 numbers; while data afterwards 2023 is compared with 2022 numbers. This visual needs to be updated or split into two different graphics...\n\nLast updated: ${seated_latest}. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1277,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1596,"value":"viewof smooth = Inputs.radio(\n new Map([\n [\"Daily (no smoothing)\", 1],\n [\"Weekly\", 7],\n [\"Bi-Weekly\", 14],\n [\"28-day period\", 28]\n ]),\n { value: 7, label: \"Rolling Average:\" }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1594,"value":"seated1 = Plot.plot({\n marks: [Plot.ruleY([0])], // draw a line at x=0\n marginLeft: 50,\n x: {\n type: \"time\",\n tickFormat: (d) =>\n d.getMonth() === 0\n ? d3.timeFormat(\"%Y\")(d)\n : d.getMonth() % 2 === 0\n ? d3.timeFormat(\"%b\")(d)\n : \"\"\n },\n y: {\n label: `↑ %Change: ${smooth}-day moving avg`,\n domain: [-100, 100],\n grid: true\n },\n marks: [\n Plot.line(\n seated_data.filter(({ date }) => {\n const year = new Date(date).getFullYear();\n return year >= 2016 && year < 2023;\n }),\n Plot.windowY({\n x: \"date\",\n y: \"change\",\n k: smooth,\n stroke: \"lightblue\"\n })\n ),\n Plot.line(\n seated_data.filter(({ date }) => {\n const year = new Date(date).getFullYear();\n return year === 2023;\n }),\n Plot.windowY({\n x: \"date\",\n y: \"change\",\n k: smooth,\n stroke: \"steelblue\"\n })\n )\n ],\n width,\n marginBottom: 40,\n marginRight: 100,\n height: 400\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"## Appendix ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":844,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":90,"value":"nychist = {\n const sheet = await d3.csv(\n \"https://raw.githubusercontent.com/zhik/nyc_stats/main/nychist.csv\",\n d3.autoType\n );\n // delete columns that are null\n return sheet.map((row) => {\n Object.keys(row).forEach((key) =>\n row[key] === null ? delete row[key] : 0\n );\n return row;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"nychist_industries = [...new Set(nychist.map((d) => d.SERIESCODE))]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"nychist_month_cols = [\n \"JAN\",\n \"FEB\",\n \"MAR\",\n \"APR\",\n \"MAY\",\n \"JUN\",\n \"JUL\",\n \"AUG\",\n \"SEP\",\n \"OCT\",\n \"NOV\",\n \"DEC\"\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"table_1 = {\n //reformat so all industries have their own rows and an array of time/values\n const parseTime = d3.timeParse(\"%b %d, %Y\");\n return nychist_industries.map((ind) => {\n const ind_rows = nychist.filter((row) => row.SERIESCODE === ind);\n const by_month = ind_rows.reduce((arr, row) => {\n const year = row.YEAR;\n //for each month check, if month in obj, create a new obj with date + value\n nychist_month_cols.forEach((col) => {\n if (col in row) {\n arr.push({\n date: formatMonthYear(parseTime(`${col} 1, ${year}`)),\n value: row[col]\n });\n }\n });\n\n return arr;\n }, []);\n\n return {\n name: ind_rows[0].INDUSTRY_TITLE,\n seriesCode: ind,\n data: by_month\n };\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":147,"value":"$3b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":161,"value":"nychist_latest_month = {\n const parseTime = d3.timeParse(\"%b %d, %Y\");\n\n const first_row = nychist[0];\n const year = first_row.YEAR;\n const month = nychist_month_cols.reduce((latest, month) => {\n if (month in first_row) {\n latest = month;\n }\n return latest;\n }, \"JAN\");\n\n return parseTime(`${month} 1, ${year}`);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1570,"value":"nychist_last_year = {\n return `${nychist_latest_month.toLocaleDateString(\"en-US\", {\n month: \"short\"\n })} ${nychist_latest_month.getFullYear() - 1}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":353,"value":"formatMonthYear = d3.timeFormat(\"%b %y\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":375,"value":"function changeSparkbar(extent) {\n //get the largest extent\n let max = d3.max(extent.map((i) => Math.abs(i)));\n\n //limit max numbers to 500\n if (max > 500) max = 500;\n\n return (x) => htl.html`

${d3.format(\".2f\")(x)}%

`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":852,"value":"laus_sa_state = {\n const data = await d3.csv(\n \"https://raw.githubusercontent.com/zhik/nyc_stats/main/laus_sa_state.csv\",\n d3.autoType\n );\n\n return data.map((row) => {\n row.YEAR = d3.timeParse(\"%m %Y\")(`${row.MONTH} ${row.YEAR}`);\n return row;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":872,"value":"laus_sa_city = {\n const data = await d3.csv(\n \"https://raw.githubusercontent.com/zhik/nyc_stats/main/laus_sa_city.csv\",\n d3.autoType\n );\n\n return data.map((row) => {\n row.YEAR = d3.timeParse(\"%m %Y\")(`${row.MONTH} ${row.YEAR}`);\n return row;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":903,"value":"import { Legend, Swatches } from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":911,"value":"avg_weekly_earnings = {\n const sheet = await d3.csv(\n \"https://raw.githubusercontent.com/zhik/nyc_stats/main/nyc-weekly-earnings.csv\"\n );\n\n const data = sheet.filter((row) => typeof +row[\"Year\"] === \"number\"); //filter out % Change ... columns\n\n const parseTime = d3.timeParse(\"%b %d, %Y\");\n const months = nychist_month_cols.map(\n (month) => month[0].toUpperCase() + month.slice(1).toLowerCase()\n );\n\n return data.reduce((arr, row) => {\n const year = row.Year;\n months.forEach((col) => {\n if (col in row) {\n arr.push({\n date: parseTime(`${col} 1, ${year}`),\n value: +row[col]\n });\n }\n });\n\n return arr;\n }, []);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":968,"value":"import { Plot } from \"@mkfreeman/plot-tooltip\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1006,"value":"neighbs = FileAttachment(\"neighbs@3.geojson\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1040,"value":"boros = FileAttachment(\"boros.geojson\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1050,"value":"mn_median_asking_rent = {\n const data = await d3.csv(\n \"https://raw.githubusercontent.com/zhik/nyc_stats/main/medianAskingRent_All.csv\"\n );\n\n //filter for Manhattan neighborhoods\n const mn_data = data.filter(\n (row) =>\n row.Borough === \"Manhattan\" &&\n [\"neighborhood\", \"borough\"].includes(row.areaType)\n );\n\n //get columns and tranpose dataset\n const dates = Object.keys(mn_data[0]).filter((i) => i.startsWith(\"20\"));\n\n return mn_data\n .reduce((arr, row) => {\n return [\n ...arr,\n ...dates.map((date) => ({\n date: d3.timeParse(\"%Y-%m\")(date),\n areaName: row.areaName,\n areaType: row.areaType,\n value: +row[date]\n }))\n ];\n }, [])\n .sort((a, b) => a.date - b.date);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1067,"value":"latest_date = d3.max(mn_median_asking_rent, (d) => d.date)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1095,"value":"latest_rent_data = mn_median_asking_rent.filter(\n (i) =>\n i.date.getTime() === latest_date.getTime() && i.areaType === \"neighborhood\"\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1088,"value":"rent_color_scale = d3\n .scaleSequentialQuantile(d3.interpolateReds)\n .domain(latest_rent_data.map((i) => i.value))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1164,"value":"mutable clicked_neibh = null","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1126,"value":"import { Tooltip } from \"@clhenrick/tooltip-component\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1263,"value":"seated_data = {\n const data = await d3.csv(\n \"https://raw.githubusercontent.com/zhik/nyc_stats/main/2020-2022vs2019_Reopened_Seated_Diner_Data.csv\"\n );\n\n //get only nyc\n const find = data.find((d) => d.Type === \"city\" && d.Name === \"New York\");\n\n //change to row\n const dates = Object.keys(find)\n .filter((key) => key.startsWith(\"20\"))\n .map((key) => ({\n date: new Date(key),\n change: +find[key].replace(\"%\", \"\"),\n year: new Date(key).getFullYear()\n }));\n //remove extreme changes\n return dates.filter((d) => d.change < 50);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1306,"value":"seated_latest = seated_data[seated_data.length - 1].date.toLocaleDateString()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1780,"value":"null","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"}],"files":"$W3c","stdlib":"1","titling":"auto"}} 31:"$30:body"