${data.title[0]}${labels[j] && ` (${labels[j]})`} ${data.title[1]}${labels[i] && ` (${labels[i]})`}

2a:null 2b:["$","title",null,{"children":"Andrea Scardina: Assignment 4 | ascardina-gis | Observable"}] 30:T45e,//creates legend legend = () => { const k = 24; const arrow = DOM.uid(); return svg` ${d3.cross(d3.range(n), d3.range(n)).map(([i, j]) => svg` ${data.title[0]}${labels[j] && ` (${labels[j]})`} ${data.title[1]}${labels[i] && ` (${labels[i]})`} `)} ${data.title[0]} ${data.title[1]} `; }31:[{"id":"020c2c6a9dc9616af7d6cf40f8303f382acd82fd400953aafb60b11955ea29885995cdce972cd33c37d201bbad8da615a4c27d2a569bd98738cbd5f128d97c62","href":"https://static.observableusercontent.com/files/020c2c6a9dc9616af7d6cf40f8303f382acd82fd400953aafb60b11955ea29885995cdce972cd33c37d201bbad8da615a4c27d2a569bd98738cbd5f128d97c62","name":"tracts.json","type":"application/json","lastModified":1586576076428.094,"size":4230748},{"id":"29ea237de89e46acd7b6a2e3611761d52f3846a05a58668cfdccd62ae07b2798bd670aeedee579a7c7f8af31bb7fb8933a279db0faa4835427125aa86aa51d4a","href":"https://static.observableusercontent.com/files/29ea237de89e46acd7b6a2e3611761d52f3846a05a58668cfdccd62ae07b2798bd670aeedee579a7c7f8af31bb7fb8933a279db0faa4835427125aa86aa51d4a","name":"Census2000DemProfile1GeneralTract@1.csv","type":"text/csv","lastModified":1586576674358.56,"size":264617}] 2e:{"id":"1029b0aa5aeb9d11","slug":"andrea-scardina-assignment-4","title":"Andrea Scardina: Assignment 4","thumbnail":"ba2b6901bd0001a568856c52f499e3ca8131566a37eca191771441d72ca293c1","access_level":"public","create_time":"$D2020-04-11T00:42:57.929Z","update_time":"$D2020-04-13T03:31:20.250Z","view_time":null,"first_public_time":"$D2020-04-11T04:07:39.039Z","fork":{"id":"de68dfd4266dab75","slug":"bivariate-choropleth-mapping","title":"Bivariate Choropleth Mapping","owner":{"id":"1522f7962f5f1185","login":"caglarkoylu","name":"Caglar Koylu"}},"stars":0,"starred":false,"owner":{"type":"team","id":"3c776b133fe88240","login":"ascardina-gis","name":"","avatar_url":"https://avatars-next.observableusercontent.com/00f2f460dddf3976009ccd802dcad0fe6947f293dd327f265bc2c0a4e459c54b","tier":"starter_2024"},"version":574,"publish_version":574,"role":null,"authored":false,"authors":[{"type":"individual","id":"2e5feeeb49882ff0","login":"ascardina-gis","name":"","avatar_url":"https://avatars-next.observableusercontent.com/00f2f460dddf3976009ccd802dcad0fe6947f293dd327f265bc2c0a4e459c54b","tier":null}],"members":[{"type":"individual","id":"2e5feeeb49882ff0","login":"ascardina-gis","name":"","avatar_url":"https://avatars-next.observableusercontent.com/00f2f460dddf3976009ccd802dcad0fe6947f293dd327f265bc2c0a4e459c54b","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"Andrea Scardina: Assignment 4","cells":[{"id":0,"value":"md`# Andrea Scardina: Assignment 4\nAverage household size and percent owner occupied by Census Tracts of Minneapolis Metropolitan Area`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":194,"value":"viewof colors = {\n const form = html`

color scheme`;\n form.i.selectedIndex = 1;\n form.oninput = () => form.value = schemes[form.i.selectedIndex].colors;\n form.oninput();\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":14,"value":"chart = {\n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [0, 0, width, height]);\n\n //location of legend\n svg.append(legend)\n .attr(\"transform\", \"translate(200,100)\");\n\n svg.append(\"g\")\n .selectAll(\"path\")\n .data(polygons.features)\n .join(\"path\")\n .attr(\"fill\", d => color(data.get(d.properties[idAttribute])))\n .attr(\"d\", path)\n .append(\"title\")\n .text(d => `${d.properties[idAttribute]}, ${format(data.get(d.properties[idAttribute]))}`);\n\n return svg.node();\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":570,"value":"md`# Interpretation\nThere is a clear delineation between the smaller tracts around the center of the metropolitan area, and the larger tracts on the outskirts. On the outskirts there are many large areas of households that are both large and owner-occupied, where as in the center the tracts are more likely to be large and rented, small and owner, or small and rented. This probably has to do with high real estate prices closer to downtown.`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":359,"value":"// http://www.joshuastevens.net/cartography/make-a-bivariate-choropleth-map/\nschemes = [\n {\n name: \"RdBu\", \n colors: [\n \"#e8e8e8\", \"#e4acac\", \"#c85a5a\",\n \"#b0d5df\", \"#ad9ea5\", \"#985356\",\n \"#64acbe\", \"#627f8c\", \"#574249\"\n ]\n },\n {\n name: \"BuPu\", \n colors: [\n \"#e8e8e8\", \"#ace4e4\", \"#5ac8c8\",\n \"#dfb0d6\", \"#a5add3\", \"#5698b9\", \n \"#be64ac\", \"#8c62aa\", \"#3b4994\"\n ]\n },\n {\n name: \"GnBu\", \n colors: [\n \"#e8e8e8\", \"#b5c0da\", \"#6c83b5\",\n \"#b8d6be\", \"#90b2b3\", \"#567994\",\n \"#73ae80\", \"#5a9178\", \"#2a5a5b\"\n ]\n },\n {\n name: \"PuOr\", \n colors: [\n \"#e8e8e8\", \"#e4d9ac\", \"#c8b35a\",\n \"#cbb8d7\", \"#c8ada0\", \"#af8e53\",\n \"#9972af\", \"#976b82\", \"#804d36\"\n ]\n }\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":216,"value":"labels = [\"low\", \"\", \"high\"]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":207,"value":"n = Math.floor(Math.sqrt(colors.length))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":209,"value":"x = d3.scaleQuantile(Array.from(data.values(), d => d[0]), d3.range(n))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":204,"value":"y = d3.scaleQuantile(Array.from(data.values(), d => d[1]), d3.range(n))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":486,"value":"path = d3.geoPath().projection(projection)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":462,"value":"//Rotate the map sets the longitude of origin for our UTM projection.\nprojection = d3.geoTransverseMercator().rotate([93,0]).fitExtent([[10, 10], [width, height]], polygons);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":467,"value":"//combines two lines of code, read csv and define which attributes to use\n//in title at bottom, two attributes define the two sides of the legend\ndata = Object.assign(new Map(d3.csvParse(await FileAttachment(\"Census2000DemProfile1GeneralTract@1.csv\").text(), ({TRACT, HHLDSIZE, HSGOCCOWN, HSGUNITS}) => [+TRACT, [+HHLDSIZE, 100 * +HSGOCCOWN / +HSGUNITS]])), {title: [\"Avg household\", \"% owner occupied\"]})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":483,"value":"//code much smoother if you identify your unique id here\nidAttribute = \"TRACT\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8,"value":"//create csv from original shapefile if you don't have one\npolygons = FileAttachment(\"tracts.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":427,"value":"height = 610","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":424,"value":"width = 875","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":480,"value":"$30","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":477,"value":"color = {\n return value => {\n if (!value) return \"#ccc\";\n let [a, b] = value;\n return colors[y(b) + x(a) * n];\n };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":513,"value":"formatNum = d3.format(\".1f\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":474,"value":"//formats values and labels, needed in any bivariate map\nformat = (value) => {\n if (!value) return \"N/A\";\n let [a, b] = value;\n return `${a} ${data.title[0]}${labels[x(a)] && ` (${labels[x(a)]})`}\n${formatNum(b)} ${data.title[1]}${labels[y(b)] && ` (${labels[y(b)]})`}`;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6,"value":"topojson = require(\"topojson-client@3\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 2f:"$2e:body"