2c:null 2d:["$","title",null,{"children":"Project 4 | Dynamic Data Visualization 373 | Observable"}] 32:T515,map = { let w = d3.min([width, 700]); let h = 0.6 * w; let pad = 10; let svg = d3 .create("svg") .attr("viewBox", [0, 0, w, h]) .style("max-width", `${w}px`); let projection = d3.geoCylindricalEqualArea().parallel(30); let path = d3.geoPath().projection(projection); let color_scale = d3 .scaleQuantile() .domain(finaldensities) .range(d3.schemeBlues[8]); svg .append("g") .selectAll("path") .data(data.features) .join("path") .attr("d", path) .attr("fill", (d) => color_scale(densities.get(d.properties.ISO_A3))) .attr("stroke", "black") .attr("stroke-width", 1) .on("pointerenter", function () { d3.select(this).attr("stroke-width", 2.5).raise(); }) .on("pointerleave", function () { d3.select(this).attr("stroke-width", 1); }) .each(function (d) { let admin = d.properties.ADMIN; let dense = densities.get(d.properties.ISO_A3); tippy(this, { content: `

${`

NAME: ${admin}

DENSITY: ${dense}

`, allowHTML: true, theme: "light-border" }); }); svg.node().scale = color_scale; return svg.node(); }33:[{"id":"289abe21eafa93ffc87d04af2d7d935a22ec808303cc0705698f87efbd0d17260ed9a61c63859de0e2cd1f0781c2491fc42b82853ce94a33e41424ae7b99e4be","href":"https://static.observableusercontent.com/files/289abe21eafa93ffc87d04af2d7d935a22ec808303cc0705698f87efbd0d17260ed9a61c63859de0e2cd1f0781c2491fc42b82853ce94a33e41424ae7b99e4be","name":"data.csv","type":"text/csv","lastModified":1680791066827.218,"size":31888},{"id":"892d0932c83044640a3e7c3198c72874d4578b972eacc0d59f78a2606d76f39e059f535d61d0cb7becef572082dd7f23cc57122c39ea3a98d0da04027e8bac08","href":"https://static.observableusercontent.com/files/892d0932c83044640a3e7c3198c72874d4578b972eacc0d59f78a2606d76f39e059f535d61d0cb7becef572082dd7f23cc57122c39ea3a98d0da04027e8bac08","name":"Project4.json","type":"application/json","lastModified":1680791345723.445,"size":58590}] 30:{"id":"191348882c05c051","slug":null,"title":"Project 4","thumbnail":"c16e89f1a1adb4d5ff9582d3bf7061e16fae23fd96e29e0d13750ba12f4e2fda","access_level":"public","create_time":"$D2023-04-06T14:19:50.638Z","update_time":"$D2023-05-07T20:48:53.929Z","view_time":null,"first_public_time":"$D2023-05-07T20:49:20.750Z","fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"a07c87acf1b22f86","login":"ddv373","name":"Dynamic Data Visualization 373","avatar_url":"https://avatars-next.observableusercontent.com/aa07fb823a47852e43ceca20a9030290c7b3befd6ad2b87a17c17f4b47176d35","tier":"pro_2024"},"version":206,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"88765673c19b405a","login":"cjenkin5","name":"Chase Jenkins","avatar_url":"https://avatars-next.observableusercontent.com/5a4337860ed5f204b19d9ae944a4a397a095312731daf3dee97c0aeceebb7306","tier":null}],"members":[{"type":"individual","id":"88765673c19b405a","login":"cjenkin5","name":"Chase Jenkins","avatar_url":"https://avatars-next.observableusercontent.com/5a4337860ed5f204b19d9ae944a4a397a095312731daf3dee97c0aeceebb7306","tier":null,"role":"editor"},{"type":"individual","id":"c3301e515dd08a41","login":"mcmcclur","name":"Mark McClure","avatar_url":"https://avatars-next.observableusercontent.com/e615e819ce83d43faef607e48c53c5ff63943aa0ba9f5848499bd02fef7396f4","tier":null,"role":"editor"},{"type":"team","id":"a07c87acf1b22f86","login":"ddv373","name":"Dynamic Data Visualization 373","avatar_url":"https://avatars-next.observableusercontent.com/aa07fb823a47852e43ceca20a9030290c7b3befd6ad2b87a17c17f4b47176d35","tier":"pro_2024","role":"viewer"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Project 4","cells":[{"id":0,"value":"# Project 4","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":108,"value":"legend = Legend(map.scale, {\n tickFormat: (n) => `${d3.format(\",\")(Math.floor(n))}`\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"finaldensities = data.features.map(function (o) {\n let p = test.get(o.properties.ISO_A3);\n if (p) {\n return parseFloat(p[0].density);\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"test = d3.group(countries_pop, (o) => o.cca3)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"densities = d3.rollup(\n countries_pop,\n (a) => Number.parseFloat(a[0].density),\n (o) => o.cca3\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":155,"value":"# IMPORTS","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":8,"value":"countries_pop = await FileAttachment(\"data.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"data = {\n let countries = await FileAttachment(\"Project4.json\").json();\n countries = topojson.feature(countries, countries.objects.countries);\n return countries;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"d3 = require(\"d3\", \"d3-geo-projection\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"import { Swatches, Legend } from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":147,"value":"tippy = require(\"tippy.js@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 31:"$30:body"