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

2d:null 2e:["$","title",null,{"children":"Bivariate Choropleth Map | Caglar Koylu | Observable"}] 33:T4d7,// http://www.joshuastevens.net/cartography/make-a-bivariate-choropleth-map/ schemes = [ { name: "RdBu", colors: [ "#e8e8e8", "#e4acac", "#c85a5a", "#b0d5df", "#ad9ea5", "#985356", "#64acbe", "#627f8c", "#574249" ] }, { name: "PuGr", colors: [ "#e8e8e8", "#d3e8e0", "#9ce8cb", "#e8bedf", "#d3bedf", "#9cbecb", "#e88ed4", "#d38ed4", "#9c8ecb" ] }, { name: "BrBu", colors: [ "#d3d3d3", "#77b6ba", "#0b949c", "#b1986e", "#648361", "#096b51", "#905c08", "#514f07", "#074106" ] }, { name: "BuPu", colors: [ "#e8e8e8", "#ace4e4", "#5ac8c8", "#dfb0d6", "#a5add3", "#5698b9", "#be64ac", "#8c62aa", "#3b4994" ] }, { name: "GnBu", colors: [ "#e8e8e8", "#b5c0da", "#6c83b5", "#b8d6be", "#90b2b3", "#567994", "#73ae80", "#5a9178", "#2a5a5b" ] }, { name: "GnPu", colors: [ "#d3d3d3", "#8fceb7", "#2dc58e", "#ab8bcb", "#7488b0", "#258288", "#803fc3", "#573da9", "#1c3b83" ] }, { name: "PuOr", colors: [ "#e8e8e8", "#e4d9ac", "#c8b35a", "#cbb8d7", "#c8ada0", "#af8e53", "#9972af", "#976b82", "#804d36" ] } ]34:T44c,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]} `; }35:[{"id":"b6d0e092b73c042d726b83ba01118c7b9c68cd9a1055427ab94cf3b5340e0fa33bb3f9e2fe0aa806c23adcd978e5c08b046722c7e3509d363bf0eafe9ce4491e","href":"https://static.observableusercontent.com/files/b6d0e092b73c042d726b83ba01118c7b9c68cd9a1055427ab94cf3b5340e0fa33bb3f9e2fe0aa806c23adcd978e5c08b046722c7e3509d363bf0eafe9ce4491e","name":"Louisiana.csv","type":"text/csv","lastModified":1586535780542.603,"size":20187},{"id":"0131b325bf1e89e90b82a61b8bdb6456e00f39ab9f68541d0c2af33a6797e4a79ec36027caaf85be6d0776080de9e28a2772ce4e3793cbb36be5bbfb0f559f74","href":"https://static.observableusercontent.com/files/0131b325bf1e89e90b82a61b8bdb6456e00f39ab9f68541d0c2af33a6797e4a79ec36027caaf85be6d0776080de9e28a2772ce4e3793cbb36be5bbfb0f559f74","name":"LouisianaTOPO.json","type":"application/json","lastModified":1586535780542.603,"size":83278}] 31:{"id":"54e876d944bb5d5f","slug":"bivariate-choropleth-map","title":"Bivariate Choropleth Map","thumbnail":"0f46c4b70ef52e94ec084755984622be55fa41633898a4c7454aa5d3cfa31cd2","access_level":"public","create_time":"$D2020-04-10T16:23:00.542Z","update_time":"$D2020-04-10T16:29:58.069Z","view_time":null,"first_public_time":"$D2020-04-10T16:30:09.934Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"1522f7962f5f1185","login":"caglarkoylu","name":"Caglar Koylu","avatar_url":"https://avatars-next.observableusercontent.com/94b0c40bf8a6b04057088ea171864451b3e3b27b7346d866d2a7be21d077be76","tier":"starter_2024"},"version":620,"publish_version":620,"role":null,"authored":false,"authors":[{"type":"individual","id":"60e9af384dfce94c","login":"caglarkoylu","name":"Caglar Koylu","avatar_url":"https://avatars-next.observableusercontent.com/94b0c40bf8a6b04057088ea171864451b3e3b27b7346d866d2a7be21d077be76","tier":null}],"members":[{"type":"individual","id":"60e9af384dfce94c","login":"caglarkoylu","name":"Caglar Koylu","avatar_url":"https://avatars-next.observableusercontent.com/94b0c40bf8a6b04057088ea171864451b3e3b27b7346d866d2a7be21d077be76","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Bivariate Choropleth Map","cells":[{"id":0,"value":"md`# Bivariate Choropleth Map\n\nMapping Vulnerability: Single Mother Households and % Black by County in Louisiana (2010 Census Demographics 2010)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$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","output":"$undefined","database":"$undefined"},{"id":14,"value":"chart = {\n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [40, 50, width, height]);\n\n svg.append(legend)\n .attr(\"transform\", \"translate(660,190)\");\n\n svg.append(\"g\")\n .selectAll(\"path\")\n .data(topojson.feature(polygons, polygons.objects.LouisianaGEO).features)\n .join(\"path\")\n .attr(\"fill\", d => color(data.get(d.properties[idAttribute])))\n .attr(\"d\", path)\n .attr(\"stroke\", \"#d3d3d3\")\n .attr(\"stroke-width\", 0.3)\n .append(\"title\")\n .text(d => `${d.properties[idAttribute]}, ${format(data.get(d.properties[idAttribute]))}`);\n\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":359,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":216,"value":"labels = [\"low\", \"\", \"high\"]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":207,"value":"n = Math.floor(Math.sqrt(colors.length))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$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","output":"$undefined","database":"$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","output":"$undefined","database":"$undefined"},{"id":486,"value":"path = d3.geoPath().projection(projection)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":462,"value":"//Rotate the map sets the longitude of origin for our UTM projection.\nprojection = d3.geoTransverseMercator()\n .rotate([93, 0])\n .center([0, 62])\n .fitExtent([[80, 80], [width, height]], polygon_features);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":430,"value":"polygon_features = topojson.feature(polygons, polygons.objects.LouisianaGEO)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":467,"value":"data = Object.assign(new Map(d3.csvParse(await FileAttachment(\"Louisiana.csv\").text(), ({NAME, BLACK, FHH_CHILD, POP2010}) => [NAME, [+FHH_CHILD, 100 * +BLACK/+POP2010]])), {title: [\"Single Mother Households\", \"% Black\"]})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":483,"value":"idAttribute = \"NAME\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"polygons = FileAttachment(\"LouisianaTOPO.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":427,"value":"height = 550","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":424,"value":"width = 875","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":480,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$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","output":"$undefined","database":"$undefined"},{"id":604,"value":"formatNum = d3.format(\".1f\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":474,"value":"format = (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","output":"$undefined","database":"$undefined"},{"id":6,"value":"topojson = require(\"topojson-client@3\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 32:"$31:body"