29:null 2a:["$","title",null,{"children":"The coronavirus pandemic ends when this chart shrinks again | vizqing | Observable"}] 2f:T451,{ let colors = ""; if (category == "region") { for (let i = 0; i < regions.length; i++) { i < regions.length - 1 ? (colors = colors + `✦ ${ regions[i] }, `) : (colors = colors + ` and ✦ ${ regions[i] }`); } return md`The chart is arranged into **regions** from West to East, with the U.S. pulled out to make trends easier to see. Here's the color scheme: ${colors}.`; } else if (category == "country") { for (let i = 0; i < codesHighlight.length; i++) { colors = colors + `✦ ${ d3.group(crosswalk, d => d["iso"]).get(codesHighlight[i])[0]["geo"] }, `; } return md`The chart is arranged into **countries**, with a few highlighted to show trends. Here's the color scheme: ${colors} and the rest are ✦.`; } }30:T84c,streamgraph = { // Create the svg container: const svg = d3 .create("svg") .attr("viewBox", [0, 0, dms.width, dms.height]) .attr("width", dms.width) .attr("height", dms.height) .style("background", "white"); const chart = svg .append("g") .attr("transform", `translate(${dms.marginLeft} ${dms.marginTop})`); // Add axes: const axisLeft = d3 .axisLeft(y) .ticks(10) .tickSize(-dms.chartWidth); chart .append("g") .attr("class", "axis") .call(axisLeft) .call(g => g.select(".domain").remove()) .call(g => g .selectAll(".tick text") .attr("x", 0) .attr("dy", -4) .attr("text-anchor", "start") ) .call(g => g.selectAll(".tick line").attr("stroke", "lightgray")); // Add streams: chart .append("g") .selectAll("path") .data(dataSeries) .join("path") .attr("d", area) .attr("fill", d => { if (category == "country") { return codesHighlight.indexOf(d["key"]) >= 0 ? color(d["key"]) : colorsGray; } else { return color(d["key"]); } }) .attr("class", d => "stream stream" + d["key"].split(" ").join("")) .on("mousemove", hover) .on("mouseleave", leave); const annotation = chart.append("g").attr("class", "annotation"); annotation.append("path").attr("pointer-events", "none"); annotation .append("text") .attr("class", "annotation annotation__date") .attr("x", 0) .attr("dy", -4) .attr("text-anchor", "start") .attr("font-size", "10px") .attr("font-family", "sans-serif"); annotation .append("text") .attr("class", "annotation annotation__data") .attr("x", dms.chartWidth) .attr("dy", -4) .attr("text-anchor", "end") .attr("font-size", "10px") .attr("font-family", "sans-serif"); annotation .append("text") .attr("class", "annotation annotation__country") .attr("x", dms.chartWidth) .attr("dy", 10) .attr("text-anchor", "end") .attr("font-size", "10px") .attr("font-family", "sans-serif"); return svg.node(); }31:T503,dataDeathsRolling = { const byCountry = d3.groups(data, d => d["iso"]); const byCountryWithAverages = byCountry.map(elem => { const allDays = elem[1]; const allDaysWithDaily = []; for (let i = 0; i < allDays.length; i++) { if (i > 0) { allDays[i].deathsDaily = allDays[i]["deaths"] - allDays[i - 1]["deaths"]; allDaysWithDaily.push(allDays[i]); } else { allDays[i].deathsDaily = allDays[i]["deaths"]; allDaysWithDaily.push(allDays[i]); } } const days = 14; const allDaysWithAverage = []; for (let i = 0; i < allDays.length; i++) { let daysTemp; if (i < days) { daysTemp = i; } else { daysTemp = days; } let numbersForAverage = []; for (let j = 0; j <= daysTemp; j++) { numbersForAverage.push(d3.max([allDays[i - j]["deathsDaily"], 0])); } allDays[i].deathsAvg = d3.sum(numbersForAverage) / numbersForAverage.length; allDaysWithAverage.push(allDays[i]); } return allDaysWithAverage; }); return d3 .merge(byCountryWithAverages) .sort( (a, b) => d3.ascending(timeParser(a["date"]), timeParser(b["date"])) || d3.ascending(a["country"], b["country"]) ); }32:[{"id":"5a40cab569f31539b71b02a23e6cd46b22685751b5bfe602b4d3e17cce4e4ce93a4538111ff4a0195cf8f7ba129da3cc8bc3bd132c52614db76eb12910fb1681","href":"https://static.observableusercontent.com/files/5a40cab569f31539b71b02a23e6cd46b22685751b5bfe602b4d3e17cce4e4ce93a4538111ff4a0195cf8f7ba129da3cc8bc3bd132c52614db76eb12910fb1681","name":"CrosswalkContinents-style-1.csv","type":"text/csv","lastModified":1695060306161.152,"size":5447},{"id":"a5f777985e74b32d7483aa3202b52ac307c7239441342772cbd9c2f13858faa5b81d34afdcfcf8bb4cbc195e0ee56af8e9392000b24148f01e93bfea26b364f7","href":"https://static.observableusercontent.com/files/a5f777985e74b32d7483aa3202b52ac307c7239441342772cbd9c2f13858faa5b81d34afdcfcf8bb4cbc195e0ee56af8e9392000b24148f01e93bfea26b364f7","name":"world-daily-historical-combined (2)@1.csv","type":"text/csv","lastModified":1695060306161.152,"size":5524424},{"id":"f9d55009970191b0b79e2cb5a498561cb0daae583048d66ea6e027535b76be63481d5f13af52610ecd8bbae9eb4b83fb88a6c52a2d5adb8f87e005932456a0ad","href":"https://static.observableusercontent.com/files/f9d55009970191b0b79e2cb5a498561cb0daae583048d66ea6e027535b76be63481d5f13af52610ecd8bbae9eb4b83fb88a6c52a2d5adb8f87e005932456a0ad","name":"backfill.csv","type":"text/csv","lastModified":1695060306161.152,"size":437331}] 2d:{"id":"92392876bfef0ec4","slug":null,"title":"The coronavirus pandemic ends when this chart shrinks again","thumbnail":"2a5c80038e56e846201137d183a180fb991c3d7344098d3e6ac32809ad30cb9e","access_level":"public","create_time":"$D2023-09-18T18:05:06.161Z","update_time":"$D2023-09-18T18:05:06.161Z","view_time":null,"first_public_time":"$D2023-09-18T18:05:06.161Z","fork":{"id":"5e371b2af6f75b61","slug":"the-coronavirus-pandemic-ends-when-this-chart-shrinks-agai","title":"The coronavirus pandemic ends when this chart shrinks again","owner":{"id":"ef15c7dc08ff310a","login":"attharmirza","name":"Atthar Mirza"}},"stars":0,"starred":false,"owner":{"type":"team","id":"008f123a7234eb35","login":"yuqing","name":"vizqing","avatar_url":"https://avatars-next.observableusercontent.com/0a51e26a870fdce2fa5f3ddc3b4b9d3ef9c72cdee2a0337d4aecd07c2e2d0963","tier":"starter_2024"},"version":2197,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"3ef2ab2a685fd836","login":"yuqing","name":"vizqing","avatar_url":"https://avatars-next.observableusercontent.com/0a51e26a870fdce2fa5f3ddc3b4b9d3ef9c72cdee2a0337d4aecd07c2e2d0963","tier":null}],"members":[{"type":"individual","id":"3ef2ab2a685fd836","login":"yuqing","name":"vizqing","avatar_url":"https://avatars-next.observableusercontent.com/0a51e26a870fdce2fa5f3ddc3b4b9d3ef9c72cdee2a0337d4aecd07c2e2d0963","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"The coronavirus pandemic ends when this chart shrinks again","cells":[{"id":0,"value":"md`# The coronavirus pandemic ends when this chart shrinks again`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1902,"value":"{\n const totalDeaths =\n dataDeathsTotalCumulative[dataDeathsTotalCumulative.length - 1];\n\n return md`This project was an attempt at understanding the scale of the coronavirus pandemic — a pandemic which has, as of ${\n totalDeaths[0]\n }, taken at least **${commafy(\n Math.floor(totalDeaths[1] * 10) * 100\n )}** lives.`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":41,"value":"md`Here's an excerpt from the [full story](https://www.washingtonpost.com/graphics/2020/world/coronavirus-deaths-1-million/):\n\n>*From the first wave in February in China through New York City’s April catastrophe and on to India’s current surge, the coronavirus has unleashed a worldwide suffering with no evident exit.*\n\n>*The deaths started as a trickle. Then they become a torrent.*\n\nThe global coronavirus death toll is broken down using a streamgraph, showing how many people have died every day since it began. In a way, this is the story of the entire pandemic to date. You can see the early coronavirus-related deaths in China, the surge in Europe and subsequently the U.S., the rising death toll in India — and one day, hopefully, a return to the sharp point at which we started.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1481,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":66,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"md`*Worldwide coronavirus deaths from [Johns Hopkins University](https://www.arcgis.com/apps/opsdashboard/index.html#/bda7594740fd40299423467b48e9ecf6) and [The Washington Post](https://www.washingtonpost.com/graphics/2020/world/mapping-spread-new-coronavirus/), plotted with a 14 day rolling average, last updated on ${dataDeathsTotalCumulative[dataDeathsTotalCumulative.length - 1][0]}*`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"md`\n---\n## Configuring graphic containers`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"dms = {\n let dimensions = {\n width: width,\n // height: width * 2,\n marginTop: 30,\n marginLeft: d3.min([30, width / 30])\n };\n\n dimensions.height =\n width > 600\n ? (dataDeathsTotalCumulative.length - 1) * 7 + dimensions.marginTop * 2\n : (dataDeathsTotalCumulative.length - 1) * 3.5 + dimensions.marginTop * 2;\n\n dimensions.marginBottom = dimensions.marginTop;\n dimensions.marginRight = dimensions.marginLeft;\n\n dimensions.chartWidth =\n dimensions.width - dimensions.marginLeft - dimensions.marginRight;\n dimensions.chartHeight =\n dimensions.height - dimensions.marginTop - dimensions.marginBottom;\n\n return dimensions;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1869,"value":"md`## Setting up data methods`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1322,"value":"viewof category = radio({\n options: [\n { label: 'Regions', value: 'region' },\n { label: 'Countries', value: 'country' }\n ],\n value: 'region'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1327,"value":"viewof switcher = radio({\n options: [\n { label: 'Daily', value: 'daily' },\n { label: 'Cumulative', value: 'cumulative' }\n ],\n value: 'daily'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":547,"value":"timeParser = d3.timeParse(\"%m/%d/%y\")\n// timeParser = d3.timeParse(\"%Y-%m-%d\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1477,"value":"timeFormatter = function(date) {\n const months = [\n \"Jan.\",\n \"Feb.\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"Aug.\",\n \"Sept.\",\n \"Oct.\",\n \"Nov.\",\n \"Dec.\"\n ];\n const monthIndex = +d3.timeFormat('%m')(date) - 1;\n const day = +d3.timeFormat('%e')(date);\n let remainingDate = \"\";\n\n remainingDate = d3.timeFormat(`${months[monthIndex]} %-e, %Y`)(date);\n\n return remainingDate;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2107,"value":"timeFormatterReverse = d3.timeFormat(\"%m/%d/%y\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":730,"value":"crosswalk = {\n const attached = await FileAttachment(\n \"CrosswalkContinents-style-1.csv\"\n ).text();\n\n return d3\n .csvParse(attached)\n .sort(\n (a, b) =>\n d3.ascending(a[\"region\"], b[\"region\"]) ||\n d3.ascending(a[\"geo\"], b[\"geo\"])\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":753,"value":"// regions = [...d3.group(crosswalk, d => d.region).keys()]\n\nregions = [\n \"United States\",\n \"North America\",\n \"South America\",\n \"Europe and Russia\",\n \"Africa\",\n \"Middle East\",\n \"South Asia\",\n \"East Asia/Oceania\"\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":987,"value":"countries = [...d3.group(crosswalk, d => d[\"geo\"]).keys()]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1393,"value":"codes = [...d3.group(crosswalk, d => d[\"iso\"]).keys()]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1558,"value":"codesHighlight = [\"CHN\", \"ITA\", \"BRA\", \"IND\", \"USA\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1863,"value":"md`## Loading in the data\n\nA new dataset is pulled in from The Washington Post and appended to older data from Johns Hopkins University. A huge thanks to [@emamd](https://observablehq.com/@emamd) for building this whole pipeline.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1804,"value":"dataLive = {\n const attached = d3.csvParse(\n await FileAttachment(\"world-daily-historical-combined (2)@1.csv\").text()\n );\n\n // const attached = await d3.csv(\n // \"https://inv-covid-data-prod.elections.aws.wapo.pub/world-daily-historical/world-daily-historical-combined.csv\"\n // );\n\n return (\n attached\n .filter(d => d.countryIso.length > 0)\n // Convert date to the format used in the rest of the notebook\n .map(d => {\n // Remove columns we don't need\n delete d.recovered;\n delete d.source;\n delete d.confirmed;\n delete d.updated;\n\n return {\n ...d,\n deaths: +d.deaths,\n date: d3.timeFormat(\"%m/%d/%y\")(d3.timeParse(\"%Y-%m-%d\")(d.date))\n };\n })\n );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":194,"value":"data = {\n const attached = await FileAttachment(\"backfill.csv\").text();\n\n const dataBackfill = d3.csvParse(attached);\n\n const dataMerged = dataBackfill\n .concat(dataLive)\n .filter(d => d.countryIso.length > 0);\n\n const crosswalkByIso = d3.group(crosswalk, d => d[\"iso\"]);\n\n const dataProcessed = dataMerged.map((d, i, arr) => {\n let { country, countryIso, deaths, date } = d;\n return {\n country: country,\n iso: countryIso,\n region: crosswalkByIso.get(countryIso)[0][\"region\"],\n date: timeFormatterReverse(timeParser(date)),\n deaths: +deaths\n };\n });\n\n return dataProcessed.sort(\n (a, b) =>\n d3.ascending(timeParser(a[\"date\"]), timeParser(b[\"date\"])) ||\n d3.ascending(a[\"country\"], b[\"country\"])\n );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"md`## Performing data transforms\n\nOnce the data is loaded and formatted correctly, deaths per day, a rolling average, etc. are calculated.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1239,"value":"$31","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":205,"value":"dataDeathsCumulative = {\n return d3.rollup(\n dataDeathsRolling,\n v => d3.sum(v, d => d.deaths),\n d => d.date,\n d => (category == \"region\" ? d[\"region\"] : d[\"iso\"])\n );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1136,"value":"dataDeathsDaily = {\n return d3.rollup(\n dataDeathsRolling,\n v => d3.sum(v, d => d[\"deathsAvg\"]),\n d => d[\"date\"],\n d => (category == \"region\" ? d[\"region\"] : d[\"iso\"])\n );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1469,"value":"dataDeathsTotalCumulative = {\n const total = d3.rollup(\n dataDeathsRolling,\n v => d3.sum(v, d => d[\"deaths\"] / 1000),\n d => timeFormatter(timeParser(d[\"date\"]))\n );\n return [[\"date\", \"deaths (in thousands)\"]].concat(Array.from(total));\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":686,"value":"dataSeries = {\n const stack = d3\n .stack()\n .keys(category == \"region\" ? regions : codes)\n .order(d3.stackOrderNone)\n .offset(d3.stackOffsetSilhouette);\n\n const series =\n switcher == \"daily\"\n ? stack(\n [...dataDeathsDaily.values()].map((d, i) => {\n const obj = Object.fromEntries(d.entries());\n obj.date = [...dataDeathsDaily.keys()][i];\n return obj;\n })\n )\n : stack(\n [...dataDeathsCumulative.values()].map((d, i) => {\n const obj = Object.fromEntries(d.entries());\n obj.date = [...dataDeathsCumulative.keys()][i];\n return obj;\n })\n );\n\n return series;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":346,"value":"md`## Creating scales`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":539,"value":"x = d3\n .scaleLinear()\n // .domain(d3.extent(dataSeries))\n .domain(switcher == \"daily\" ? [-8000, 8000] : [-1000000, 1000000])\n .range([0, dms.chartWidth])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":545,"value":"y = {\n let dates = [...dataDeathsCumulative.keys()].map(d => timeParser(d));\n\n return d3\n .scaleTime()\n .domain([dates[0], dates[dates.length - 1]])\n .range([0, dms.chartHeight]);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":710,"value":"color = d3\n .scaleOrdinal()\n .domain(category == \"region\" ? regions : codesHighlight)\n .range(colorsTableau)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2023,"value":"colorsTableau = [\n \"#4e79a7\",\n \"#f28e2c\",\n \"#e15759\",\n \"#76b7b2\",\n \"#59a14f\",\n \"#edc949\",\n \"#af7aa1\",\n \"#ff9da7\",\n \"#9c755f\",\n \"#bab0ab\"\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2030,"value":"colorsPurple = [\n \"#381A30\",\n \"#4D2440\",\n \"#572E48\",\n \"#6E455D\",\n \"#80526D\",\n \"#8B6177\",\n \"#966E87\",\n \"#AC899D\"\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1566,"value":"colorsGray = \"#e2e2e2\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":395,"value":"md`## Creating reusable visual elements`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":694,"value":"area = d3\n .area()\n .curve(d3.curveBasis)\n .y((d, i) => y(timeParser(d.data.date)))\n .x0(d => x(d[0]))\n .x1(d => x(d[1]))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1976,"value":"md`## Adding interactivity`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1978,"value":"function hover(event, d) {\n const [posX, posY] = d3.pointer(event);\n\n d3.selectAll(\".stream\").attr(\"opacity\", 0.3);\n d3.select(this).attr(\"opacity\", 1);\n\n d3.select(\".annotation\")\n .attr(\"transform\", `translate(0 ${posY})`)\n .attr(\"visibility\", \"visible\")\n .selectAll(\"path\")\n .attr(\"d\", `M 0 0 H ${dms.chartWidth}`)\n .attr(\"stroke\", d3.select(this).attr(\"fill\"));\n\n d3.select(\".annotation__date\").text(`${timeFormatter(y.invert(posY))}`);\n d3.select(\".annotation__data\").text(\n `At least ${commafy(\n Math.floor(\n dataDeathsDaily.get(timeFormatterReverse(y.invert(posY))).get(d[\"key\"])\n )\n )} lives lost on this day`\n );\n d3.select(\".annotation__country\")\n .text(\n category == \"country\"\n ? crosswalk.find(elem => elem[\"iso\"] == d[\"key\"])[\"geo\"]\n : d[\"key\"]\n )\n .attr(\"fill\", d3.select(this).attr(\"fill\"));\n\n d3.select(\".axis\").attr(\"opacity\", 0.3);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1979,"value":"function leave(event) {\n d3.selectAll(\".stream\").attr(\"opacity\", 1);\n\n d3.select(\".annotation\")\n .attr(\"visibility\", \"hidden\")\n .selectAll(\"path\");\n\n d3.select(\".axis\").attr(\"opacity\", 1);\n\n d3.select(\".annotation__date\").text(\"\");\n d3.select(\".annotation__data\").text(\"\");\n d3.select(\".annotation__country\").text(\"\");\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"md`\n---\n## Libraries and Packages`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"topojson = require(\"topojson-client@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":508,"value":"commafy = function(str) {\n return str.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1102,"value":"import { radio } from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 2e:"$2d:body"