${dataBi.title[0]}${labelsBi[j] && ` (${labelsBi[j]})`} ${dataBi.title[1]}${labelsBi[i] && ` (${labelsBi[i]})`}

29:null 2a:["$","title",null,{"children":"Bivariate Map of Germany | Countryman, Eian | Observable"}] 2f:T5fc,legendBi = () => { const k = 24; const arrow = DOM.uid(); //Creates the arrows seen above that indicate low to high return svg` ${d3Bi.cross(d3Bi.range(nBi), d3Bi.range(nBi)).map(([i, j]) => svg` ${dataBi.title[0]}${labelsBi[j] && ` (${labelsBi[j]})`} ${dataBi.title[1]}${labelsBi[i] && ` (${labelsBi[i]})`} `)} ${dataBi.title[0]} ${dataBi.title[1]} `; } //This function creates the legend seen above. The function utilitzes our "colors" function containing the 4 color schemes to fill the small boxes with the proper color. The function is quite complex and specifies a variety of things such as the text style, position, and boldness as well as the arrows color and size. 30:[{"id":"6ff2c28f9682e97ab9a20d91585a8238d490ba7a2a925a06a44aa8a0fa7cccf51d972c6701d0d536b67ae7cf066af9a6ac037a0271596ad50af96ce1d288d37f","href":"https://static.observableusercontent.com/files/6ff2c28f9682e97ab9a20d91585a8238d490ba7a2a925a06a44aa8a0fa7cccf51d972c6701d0d536b67ae7cf066af9a6ac037a0271596ad50af96ce1d288d37f","name":"Germany.json","type":"application/json","lastModified":1682910573605.372,"size":1632432},{"id":"5711b575cc40f47a2980334b3b0d81919a589eac20f4154cbd52c3cb8bc4447b6a4d182b1131d0486c3a1aebc40b8a6707bc45ff30e870852d98101c8be57bde","href":"https://static.observableusercontent.com/files/5711b575cc40f47a2980334b3b0d81919a589eac20f4154cbd52c3cb8bc4447b6a4d182b1131d0486c3a1aebc40b8a6707bc45ff30e870852d98101c8be57bde","name":"All_Ages.csv","type":"text/csv","lastModified":1682916533880.99,"size":1672}] 2d:{"id":"34ac69c207017135","slug":null,"title":"Bivariate Map of Germany","thumbnail":"0b4666dd45902bb3c1d213647dcfd8284a0457e06e81d7dbe1fc2d3bebdddab5","access_level":"public","create_time":"$D2023-05-01T02:47:26.639Z","update_time":"$D2023-05-07T04:38:49.770Z","view_time":null,"first_public_time":"$D2023-05-01T02:47:26.639Z","fork":{"id":"fe15dc7e0f3ad152","slug":"bivariate-choropleth-mapping","title":"Bivariate Choropleth Mapping","owner":{"id":"a6450b8113fc64e9","login":"ecountryman","name":"Countryman, Eian "}},"stars":0,"starred":false,"owner":{"type":"team","id":"a6450b8113fc64e9","login":"ecountryman","name":"Countryman, Eian ","avatar_url":"https://avatars-next.observableusercontent.com/71e33126deac679283b00a95302babf4acf525938d8d096599a46e0451848fbb","tier":"starter_2024"},"version":776,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"34f43699b8220c9e","login":"ecountryman","name":"Countryman, Eian ","avatar_url":"https://avatars-next.observableusercontent.com/71e33126deac679283b00a95302babf4acf525938d8d096599a46e0451848fbb","tier":null}],"members":[{"type":"individual","id":"34f43699b8220c9e","login":"ecountryman","name":"Countryman, Eian ","avatar_url":"https://avatars-next.observableusercontent.com/71e33126deac679283b00a95302babf4acf525938d8d096599a46e0451848fbb","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Bivariate Map of Germany","cells":[{"id":0,"value":"md`# Bivariate Map of Germany \nBy Eian Countryman, University of Iowa\n\nAge Dependency Ratios`","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":"chartBi = {\n const svg = d3Bi.create(\"svg\")\n .attr(\"viewBox\", [0, 0, widthBi, heightBi]);\n\n svg.append(legendBi)\n .attr(\"transform\", \"translate(670,100)\"); //This adds the legend to the map at the coordinates and ensures it's not buried underneath the map.\n\n svg.append(\"g\")\n .selectAll(\"path\")\n .data(topojsonBi.feature(polygonsBi, polygonsBi.objects.Ages_0to19_wgs84).features)\n .join(\"path\")\n .attr(\"stroke\", \"white\")\n .attr(\"stroke-linejoin\", \"round\")\n .attr(\"stroke-width\", .5)\n .attr(\"fill\", d => colorBi(dataBi.get(d.properties[idAttribute])))\n .attr(\"d\", pathBi)\n .append(\"title\")\n .text(d => `${d.properties[idAttribute]}, ${formatBi(dataBi.get(d.properties[idAttribute]))}`);\n\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":546,"value":"Germany_regions = FileAttachment(\"Germany.json\").json()","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: \"PuOr\", \n colors: [\n \"#e8e8e8\", \"#e4d9ac\", \"#c8b35a\",\n \"#cbb8d7\", \"#c8ada0\", \"#af8e53\",\n \"#9972af\", \"#976b82\", \"#804d36\"\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: \"BuPu\", \n colors: [\n \"#e8e8e8\", \"#ace4e4\", \"#5ac8c8\",\n \"#dfb0d6\", \"#a5add3\", \"#5698b9\", \n \"#be64ac\", \"#8c62aa\", \"#3b4994\"\n ]\n },\n {\n name: \"RdBu\", \n colors: [\n \"#e8e8e8\", \"#e4acac\", \"#c85a5a\",\n \"#b0d5df\", \"#ad9ea5\", \"#985356\",\n \"#64acbe\", \"#627f8c\", \"#574249\"\n ]\n }\n]\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":216,"value":"labelsBi = [\"low\", \"med\", \"high\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":207,"value":"nBi = Math.floor(Math.sqrt(colors.length))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":209,"value":"xBi = d3Bi.scaleQuantile(Array.from(dataBi.values(), d => d[0]), d3Bi.range(nBi))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":204,"value":"yBi = d3Bi.scaleQuantile(Array.from(dataBi.values(), d => d[1]), d3Bi.range(nBi))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":486,"value":"pathBi = d3Bi.geoPath().projection(projectionBi)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":462,"value":"projectionBi = d3Bi.geoTransverseMercator().rotate([-5,0]).fitExtent([[10, 10], [widthBi, heightBi]], polygon_featuresBi);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":430,"value":"polygon_featuresBi = topojsonBi.feature(polygonsBi, polygonsBi.objects.Ages_0to19_wgs84)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":467,"value":"dataBi = Object.assign(new Map(d3Bi.csvParse(await FileAttachment(\"All_Ages.csv\").text(), ({gen, wert_17, wert_W, wert_65p}) => [gen, [100*(+wert_17/+wert_65p), 100*(+wert_65p/+wert_W)]])), {title: [\"Youth Ratio %\", \"Elderly Ratio %\"]})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":483,"value":"idAttribute = \"gen\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8,"value":"polygonsBi = FileAttachment(\"Germany.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":427,"value":"heightBi = 610","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":424,"value":"widthBi = 850","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":480,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":477,"value":"colorBi = {\n return value => {\n if (!value) return \"#ccc\";\n let [a, b] = value;\n return colors[yBi(b) + xBi(a) * nBi];\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":513,"value":"formatNumBi = d3Bi.format(\".1f\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":474,"value":"formatBi = (value) => {\n if (!value) return \"N/A\"; //If there isn't a value it will display \"N/A\"\n let [a, b] = value;\n return `${formatNumBi(a)} ${dataBi.title[0]}${labelsBi[xBi(a)] && ` (${labelsBi[xBi(a)]})`} \n${formatNumBi(b)} ${dataBi.title[1]}${labelsBi[yBi(b)] && ` (${labelsBi[yBi(b)]})`}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6,"value":"topojsonBi = require(\"topojson-client@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3,"value":"d3Bi = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W30","stdlib":"1","titling":"auto"}} 2e:"$2d:body"