29:null 2a:["$","title",null,{"children":"USGS CDI Data Viz Series | Mike Freeman | Observable"}] 2f:T50d,twitter_icon = svg``30:[{"id":"17d7423725a6765f8684f25334b7262b1009f918f5f9bea41f953a772e0526ccd9aed92d36f7462b784754d2e80a6cfaaa804c063f6edfa572cd0d3f2a15e8eb","href":"https://static.observableusercontent.com/files/17d7423725a6765f8684f25334b7262b1009f918f5f9bea41f953a772e0526ccd9aed92d36f7462b784754d2e80a6cfaaa804c063f6edfa572cd0d3f2a15e8eb","name":"counties_formatted.csv","type":"text/csv","lastModified":1625676973663.972,"size":2062460},{"id":"835f82738290b7c0c4a673cbecf5d293d271b5b119f5e45ffa5673cf669a06e36f4640a799f35076dffc74f07debdecdea123d7841abb5ff86866248f674ceee","href":"https://static.observableusercontent.com/files/835f82738290b7c0c4a673cbecf5d293d271b5b119f5e45ffa5673cf669a06e36f4640a799f35076dffc74f07debdecdea123d7841abb5ff86866248f674ceee","name":"info.png","type":"image/png","lastModified":1625676070110.097,"size":242181}] 2d:{"id":"feb3e03fdfff2f1e","slug":"usgs-cdi-data-viz-series","title":"USGS CDI Data Viz Series","thumbnail":"3a0a641217aa300feb256680c285ad0fffc3229edc51740c3675bbb759b08345","access_level":"public","create_time":"$D2021-07-06T13:14:29.491Z","update_time":"$D2021-07-27T15:11:51.678Z","view_time":null,"first_public_time":"$D2021-07-06T13:15:37.997Z","has_unpublished_edits":null,"fork":false,"stars":4,"starred":false,"owner":{"type":"team","id":"5a7641f443a5ac2c","login":"mkfreeman","name":"Mike Freeman","avatar_url":"https://avatars-next.observableusercontent.com/c41d269cc7b9f5bea7adf2ca109c2b20486a5af02a59df0b162b2fbb33b44a17","tier":"starter_2024"},"version":275,"publish_version":275,"role":null,"authored":false,"authors":[{"type":"individual","id":"49edaef976412aba","login":"mkfreeman","name":"Mike Freeman","avatar_url":"https://avatars-next.observableusercontent.com/c41d269cc7b9f5bea7adf2ca109c2b20486a5af02a59df0b162b2fbb33b44a17","tier":null}],"members":[{"type":"individual","id":"86aa806c7292aa4d","login":"bletcher","name":"Ben Letcher","avatar_url":"https://avatars-next.observableusercontent.com/c118fb70e51f4fe8f13491b8b536c863d713d0557bcaa1e9dd4ca1809e6e2872","tier":null,"role":"editor"},{"type":"individual","id":"49edaef976412aba","login":"mkfreeman","name":"Mike Freeman","avatar_url":"https://avatars-next.observableusercontent.com/c41d269cc7b9f5bea7adf2ca109c2b20486a5af02a59df0b162b2fbb33b44a17","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":6,"collection":null,"type":"notebook","body":{"title":"USGS CDI Data Viz Series","cells":[{"id":0,"value":"# USGS CDI Data Viz Series","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":137,"value":"

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"

Data Wrangling +
Visualization
on Observable

Mike Freeman, Developer Advocate
${twitter_icon}@mf_viz

${chart}

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":133,"value":"

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"## Introduction","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"### About me","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"FileAttachment(\"info.png\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"### About Observable\nObservable is a platform for **writing code to work with data** and do other things edit edit.\n- **Reactive**: Code changes propegate throughout a notebook\n- **Collaborative**: Multiple people can collaborate in real time other edits here\n- **Transparent**: Combines code + output\n- **Reusable**: Import functions from your notebooks or the community's\n- **Free**: work in public or private for free","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":66,"value":"## Dataset\nWater consumption at the county level from 1985 - 2015","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":149,"value":"raw_data = FileAttachment(\"counties_formatted.csv\").csv({ typed: true })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":153,"value":"Inputs.table(raw_data)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":155,"value":"SummaryTable(raw_data)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":157,"value":"data = aq\n .from(raw_data)\n .rename({ ps_gallons_person_day: \"consump\" })\n .derive({ location: (d) => d.county_nm + \", \" + d.state_name })\n// .view()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":71,"value":"

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"## Where is water consumption the highest (in 2015)?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":166,"value":"top_consumers = data\n .filter((d) => d.year === 2015)\n .orderby(aq.desc(\"consump\"))\n .slice(0, 10)\n\n// .view()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"Plot.barX(top_consumers, {\n x: \"consump\",\n y: \"location\",\n fill: \"lightblue\"\n}).plot({\n marginLeft: 150,\n y: {\n domain: top_consumers.column(\"location\").data,\n label: \"\"\n }\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":190,"value":"Plot.plot({\n marks: [\n Plot.barX(top_consumers, {\n x: \"consump\",\n y: \"location\",\n fill: \"lightblue\"\n }),\n Plot.text(top_consumers, {\n x: \"consump\",\n y: \"location\",\n text: \"consump\",\n dx: 15\n })\n ],\n marginLeft: 150,\n y: {\n domain: top_consumers.column(\"location\").data,\n label: \"\"\n }\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"## How have consumption trends changed over time for counties in a selected state?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"states = data\n .dedupe(\"state_name\")\n .objects()\n .map((d) => d.state_name)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":208,"value":"chart_data = data\n .filter(aq.escape((d) => d.state_name === state))\n .filter((d) => d.consump)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":206,"value":"viewof state = Inputs.select(states, { label: \"Choose a state:\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":216,"value":"line_chart = addTooltips(\n Plot.line(chart_data, {\n x: \"year\",\n y: \"consump\",\n stroke: \"county_nm\",\n title: d => d.location\n }).plot({\n x: {\n tickFormat: \"\"\n }\n }),\n { stroke: \"black\" }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"## What is the distribution of water consumption across counties in each state (in 2015)?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":229,"value":"data_2015 = data.filter((d) => d.year === 2015)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":239,"value":"data_2015.view()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":236,"value":"state_averages = data_2015\n .groupby(\"state_name\")\n .rollup({ consump_avg: (d) => op.mean(d.consump) })\n .orderby(aq.desc(\"consump_avg\"))\n .reify()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":231,"value":"treeplot = Plot.plot({\n marks: [\n Plot.dot(data_2015, { x: \"consump\", y: \"state_name\" }),\n Plot.tickX(state_averages, {\n x: \"consump_avg\",\n y: \"state_name\",\n stroke: \"red\",\n strokeWidth: 3\n })\n ],\n marginLeft: 100,\n x: {\n type: \"log\"\n },\n y: {\n domain: state_averages.column(\"state_name\").data\n }\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":257,"value":"d3","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"## Where is the water coming from in each state (ground water, or surface water)?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":269,"value":"map_data = state_averages.rename({ consump_avg: \"value\" }).objects()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":273,"value":"drawStateMap(map_data)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":101,"value":"

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"## Appendix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":261,"value":"gsap = require(\"gsap\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":264,"value":"gsap.Back.easeIn()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"import { SummaryTable } from \"@observablehq/summary-table\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"import { addTooltips } from \"@mkfreeman/plot-tooltip\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"import { aq, op } from \"@uwdata/arquero\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":118,"value":"import { drawStateMap } from \"@mkfreeman/state-map\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":124,"value":"import { chart, color } with {\n collision_width as width,\n collision_height as height\n} from \"@d3/collision-detection/2\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":126,"value":"collision_width = 300","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":128,"value":"collision_height = 300","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W30","stdlib":"1","titling":"auto"}} 2e:"$2d:body"

Data Wrangling + Visualization on Observable

Data Wrangling +
Visualization
on Observable