44:["$","title",null,{"children":"Apple mobility data | Erica Yee | Observable"}] 4c:T856,drawCityChart = ele => { const svg = ele .append("svg") .style("height", chart_height + "px") .style("width", chart_width + "px"); // baseline svg.append('line') .style('stroke', '#C4C4C4') .style('stroke-width', 0.75) .attr("x1", x(timeParser('2020-01-13'))) .attr("y1", y(-1)) .attr("x2", x(timeParser('2020-06-09'))) .attr("y2", y(-1)) // line for shelter in place order svg.append('line') .style('stroke', '#C4C4C4') .style('stroke-width', 1) .style('stroke-dasharray', '6,3') .style('opacity', 0.7) .attr("x1", x(timeParser("2020-03-19"))) .attr("y1", 0) .attr("x2", x(timeParser("2020-03-19"))) .attr("y2", 160) // line for city data if (city_button) { svg.append("path") .data(nested_city_data) .datum(d => d.values) .attr("stroke", "#F4A045") .attr('stroke-width', 1.5) .attr('fill', 'none') .attr("d", line) } // line for county data if (county_button) { svg.append("path") .data(nested_county_data) .datum(d => d.values) .attr("stroke", "#8D6A9F") .attr('stroke-width', 1.5) .attr('stroke-opacity', .75) .attr('fill', 'none') .attr("d", line) } // line for state data if (state_button) { svg.append("path") .data(nested_state_data) .datum(d => d.values) .attr("stroke", "#05A0C4") .attr('stroke-width', 1.5) .attr('stroke-opacity', .75) .attr('fill', 'none') .attr("d", line) } // line for country data if (country_button) { svg.append("path") .data(nested_us_data) .datum(d => d.values) .attr("stroke", "#969492") .attr('stroke-width', 1.5) .attr('stroke-opacity', .75) .attr('fill', 'none') .attr("d", line) } // text labels svg.append("text") .attr("x", chart_width - 6) .attr("y", 20) .attr("font-size", "16px") .style("text-anchor", "end") .text(d => d.key) // axes svg.append("g").call(xAxis) .select('.domain').remove() svg.append("g").call(yAxis) .select('.domain').remove() }4d:[{"id":"f22347e5b57909ac126be18824f78894cb4d4826f4af675b315dd1f27b09f95c89dbd5bc3466bf177d0caf780d793233522963c87f58a61141add580687a663c","href":"https://static.observableusercontent.com/files/f22347e5b57909ac126be18824f78894cb4d4826f4af675b315dd1f27b09f95c89dbd5bc3466bf177d0caf780d793233522963c87f58a61141add580687a663c","name":"data_mob_apple_us_longer_zero.json","type":"application/json","lastModified":1591998017363.117,"size":59970},{"id":"d50e964d6e17e0d3589b7f5d3161a5b83321639b158bd18aa829a22f77d698574e1b79f28a078c7e19cb7cfb23cb040038a9fdd692da9b8844b138169ad9a69a","href":"https://static.observableusercontent.com/files/d50e964d6e17e0d3589b7f5d3161a5b83321639b158bd18aa829a22f77d698574e1b79f28a078c7e19cb7cfb23cb040038a9fdd692da9b8844b138169ad9a69a","name":"data_mob_apple_ca_counties_longer_zero.json","type":"application/json","lastModified":1591996959129.172,"size":1071468},{"id":"57d64ae0d05f2362f8d238b3d1131e5eadff0dbb88a18ae3b3ffcafed938af1092b54cf7394cbd54f7d9be8fde5b04f1e70deefa841dd736cea943c56df6a4ee","href":"https://static.observableusercontent.com/files/57d64ae0d05f2362f8d238b3d1131e5eadff0dbb88a18ae3b3ffcafed938af1092b54cf7394cbd54f7d9be8fde5b04f1e70deefa841dd736cea943c56df6a4ee","name":"data_mob_apple_ca_state_longer_zero.json","type":"application/json","lastModified":1591996366347.926,"size":19559},{"id":"ed81374bb97737f670bbf0ab2a48f24d46ff117ea1969d65badcc58d9ec8f76fda7e534ce73d0c80122f680bb5f1dd8f2ae53f9cbb64bcecba11e065c058a03e","href":"https://static.observableusercontent.com/files/ed81374bb97737f670bbf0ab2a48f24d46ff117ea1969d65badcc58d9ec8f76fda7e534ce73d0c80122f680bb5f1dd8f2ae53f9cbb64bcecba11e065c058a03e","name":"data_mob_apple_ca_cities_longer_zero.json","type":"application/json","lastModified":1591913980712.298,"size":1157364}] 48:{"id":"46d689a164a09369","slug":"apple-mobility-data","title":"Apple mobility data","thumbnail":"ea504ce1d11ac10a73f6bbd4521bfef82899ed13ae96503d9fb1667c71a4f05f","access_level":"public","create_time":"$D2020-06-11T21:47:37.804Z","update_time":"$D2020-06-30T19:28:42.944Z","view_time":null,"first_public_time":"$D2020-06-30T19:28:45.030Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"b037fb3afc5e643d","login":"ericayee","name":"Erica Yee","avatar_url":"https://avatars-next.observableusercontent.com/e06ee0f58db43307f4bc550b15cf3861ff8c70f1f6f0a132ee4fd3d803b33bd0","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":429,"publish_version":429,"role":null,"authored":false,"authors":[{"type":"individual","id":"2c988eb21019213f","login":"ericayee","name":"Erica Yee","avatar_url":"https://avatars-next.observableusercontent.com/e06ee0f58db43307f4bc550b15cf3861ff8c70f1f6f0a132ee4fd3d803b33bd0","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"2c988eb21019213f","login":"ericayee","name":"Erica Yee","avatar_url":"https://avatars-next.observableusercontent.com/e06ee0f58db43307f4bc550b15cf3861ff8c70f1f6f0a132ee4fd3d803b33bd0","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Apple mobility data","cells":[{"id":0,"value":"md`# Apple mobility data\n### [[source](https://www.apple.com/covid19/mobility)]\n\n### About the data\n* reports are published daily and reflect requests for directions in Apple Maps\n* relative volume of directions requests per country/region, sub-region or city compared to a baseline volume on January 13th, 2020\n\n### Available\n* United States: driving, transit, walking\n* California: driving\n* CA counties: driving\n* CA metro areas: driving, transit, walking (for most)\n\n### TODO\n* ✔small multiples comparison like [this example](https://bl.ocks.org/mbostock/9490516)\n* ✔selectors to compare different localities\n* ✔add y axis\n* ✔remove all but bottom x axis\n`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"city_chart = {\n const div = d3.create(\"div\").style(\"display\", \"block\");\n const charts = div\n .html(`

Apple mobility data for ${city} vs. ${county} vs. California vs. United States

dashed line indicates when shelter in place began on March 19

\n`)\n .selectAll(\"div\")\n .data(nested_us_data)\n .join(\"div\")\n .style(\"height\", chart_height + \"px\")\n .style(\"width\", chart_width + \"px\")\n .attr(\"class\", \"chart-container\")\n .call(drawCityChart)\n .selectAll('.chart-container:not(:last-of-type) .xAxis text')\n .remove()\n\n return div.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":344,"value":"viewof toggles = {\n const buttons = html`\n

Toggle data for different regions

\n \n \n \n \n `;\n \n buttons.onclick = event => {\n const type = event.target.id;\n \n switch(type) {\n case 'city':\n mutable city_button = !city_button;\n break;\n case 'county':\n mutable county_button = !county_button;\n break;\n case 'state':\n mutable state_button = !state_button;\n break;\n case 'country':\n mutable country_button = !country_button;\n break;\n }\n };\n \n return buttons;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":168,"value":"\nviewof city = select({\n title: \"Metro areas\",\n // description: \"See mobility data for a particular metro area.\",\n options: d3.map(city_data, d => d.region).keys(),\n value: \"San Francisco - Bay Area\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":227,"value":"viewof county = select({\n title: \"Counties\",\n options: d3.map(county_data, d => d.region).keys(),\n value: \"Alameda County\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":348,"value":"mutable city_button = true","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":361,"value":"mutable county_button = true","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":376,"value":"mutable state_button = true","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":378,"value":"mutable country_button = true","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"md`### Draw chart`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":62,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"md`### Scales`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"// generator for line\n// null values are considered missing data\nline = d3.line()\n .defined(d => d.rel_change != null)\n .x(d => x(timeParser(d.date)))\n .y(d => y(d.rel_change))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"timeParser = d3.timeParse('%Y-%m-%d');","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"chart_height = 150","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"chart_width = 700 - margin.left - margin.right","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":49,"value":"x = d3\n .scaleTime()\n .domain(d3.extent(filtered_city_data, d => timeParser(d.date)))\n .range([margin.left, chart_width - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"y = d3\n .scaleLinear()\n .domain(d3.extent(city_data, d => d.rel_change))\n .range([chart_height - margin.bottom, margin.top])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":122,"value":"md`### Axes`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":127,"value":"tickFormatter = d3.timeFormat('%b');","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"xAxis = g =>\n g\n .attr(\"transform\", `translate(0,${chart_height - margin.bottom})`)\n .attr(\"class\", \"xAxis\")\n .call(d3.axisBottom(x).tickFormat(tickFormatter).ticks(4).tickSize(0))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":143,"value":"yAxis = g =>\n g\n .attr(\"transform\", `translate(${margin.left},0)`)\n .attr(\"color\", \"#C4C4C4\")\n .call(d3.axisLeft(y)\n // .ticks(5)\n .tickFormat(d => d + '%'))\n .call(g => g.selectAll('.tick:nth-of-type(2) text')\n .style('font-size', 9)\n .text(`baseline`))\n ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"md`### Data`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"city_data = FileAttachment(\"data_mob_apple_ca_cities_longer_zero.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"filtered_city_data = city_data.filter(d => d.region == city)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"nested_city_data = d3\n .nest()\n .key(d => d.transportation_type)\n .entries(filtered_city_data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":186,"value":"state_data = FileAttachment(\"data_mob_apple_ca_state_longer_zero.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"nested_state_data = d3\n .nest()\n .key(d => d.transportation_type)\n .entries(state_data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":217,"value":"county_data = FileAttachment(\"data_mob_apple_ca_counties_longer_zero.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":236,"value":"filtered_county_data = county_data.filter(d => d.region == county)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":218,"value":"nested_county_data = d3\n .nest()\n .key(d => d.transportation_type)\n .entries(filtered_county_data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":252,"value":"us_data = FileAttachment(\"data_mob_apple_us_longer_zero.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":253,"value":"nested_us_data = d3\n .nest()\n .key(d => d.transportation_type)\n .entries(us_data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"md`### Appendix`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"margin = ({ top: 20, right: 20, bottom: 20, left: 50 })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"height = 500","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"allStyles = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":170,"value":"import {select, button} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":205,"value":"md`### Dump`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":206,"value":" // line for missing values\n// svg.append(\"path\")\n// .datum(d => d.values.filter(line.defined()))\n// .attr(\"stroke\", \"white\")\n// .attr(\"fill\", \"none\")\n// .attr(\"d\", line)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":232,"value":"viewof b_county = button({\n value: \"Toggle county data\",\n description: \"Only driving data available\"\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":211,"value":"viewof b_state = button({\n value: \"Toggle state data\",\n description: \"Only driving data available\"\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":258,"value":"viewof b_us = button({\n value: \"Toggle U.S. data\"\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":273,"value":"viewof b_city = button({\n value: \"Toggle metro area data\"\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4d","stdlib":"1"}} 24:null