2d:null 2e:["$","title",null,{"children":"MD Counties Testing Map | Prayag Gordy | Observable"}] 33:Ta94,chart = { const width = 975; const height = 610; const zoom = d3 .zoom() .scaleExtent([1, 4]) .on("zoom", zoomed); const svg = d3 .create("svg") .attr("viewBox", [0, 0, width, height]) .on("click", reset); const g = svg.append("g"); const projection = d3 .geoAlbersUsa() .fitSize( [width, height], topojson.feature(maryland, maryland.objects.Maryland_Counties) ); const path = d3.geoPath().projection(projection); g.append("g") .attr("cursor", "pointer") .attr("stroke", "grey") .attr("stroke-width", 0.75) .selectAll("path") .data( topojson.feature(maryland, maryland.objects.Maryland_Counties).features ) .join("path") .attr("fill", d => color(mdcases.get(d.properties.FIPS))) .on("click", clicked) .attr("d", path) .on('mouseover', function(d) { this.classList.add('hovered'); d3.select(this) .attr("stroke", "black") .raise(); tooltip.style('display', ''); let node = tooltip.node(); node.innerHTML = ""; node.appendChild(getTooltipContents(d)); }) .on('mousemove', function() { tooltip .style('top', Math.min(d3.event.pageY - 10, height - 135) + 'px') .style( 'left', (d3.event.pageX + 125 <= width ? d3.event.pageX + 10 : d3.event.pageX - 135) + 'px' ); }) .on('mouseout', function() { this.classList.remove('hovered'); d3.select(this) .attr("stroke", null) .lower(); tooltip.style('display', 'none'); }); // .on('doubleclick', function (reset) { // svg.transition().duration(750).call( // zoom.transform, // d3.zoomIdentity, // d3.zoomTransform(svg.node()).invert([width / 2, height / 2]) // ); // }); svg.call(zoom); function reset() { svg .transition() .duration(750) .call( zoom.transform, d3.zoomIdentity, d3.zoomTransform(svg.node()).invert([width / 2, height / 2]) ); } function clicked(d) { const [[x0, y0], [x1, y1]] = path.bounds(d); d3.event.stopPropagation(); svg .transition() .duration(750) .call( zoom.transform, d3.zoomIdentity .translate(width / 2, height / 2) .scale( Math.min(3, 0.9 / Math.max((x1 - x0) / width, (y1 - y0) / height)) ) .translate(-(x0 + x1) / 2, -(y0 + y1) / 2), d3.mouse(svg.node()) ); } function zoomed() { const { transform } = d3.event; g.attr("transform", transform); g.attr("stroke-width", 1 / transform.k); } return svg.node(); }34:[{"id":"f7de3e03c7ca9d63759c468d5fe1ce3b17d0277ac97be3698d4ac30a9eb3f63f0a9bed5a35fc93c9451ad82a8bacea08e56561122ce2f4b590f41359dc9db5ba","href":"https://static.observableusercontent.com/files/f7de3e03c7ca9d63759c468d5fe1ce3b17d0277ac97be3698d4ac30a9eb3f63f0a9bed5a35fc93c9451ad82a8bacea08e56561122ce2f4b590f41359dc9db5ba","name":"mdcounties@2.json","type":"application/json","lastModified":1595306754054.431,"size":56581}] 31:{"id":"da13f8276755de5e","slug":"md-counties-total-cases-map","title":"MD Counties Testing Map","thumbnail":"02c434e51d695a48c1edc74c00a926fa6ebf90d73d3deedb9a3d8d7bfcc6e95d","access_level":"public","create_time":"$D2020-07-21T04:45:54.054Z","update_time":"$D2020-08-10T04:24:19.511Z","view_time":null,"first_public_time":"$D2020-07-21T04:47:56.107Z","has_unpublished_edits":null,"fork":{"id":"26c60eb5a766bfac","slug":"coronavirus-dashboard","title":"MD Counties Total Cases Map","owner":{"id":"66b1fb28757b26dc","login":"adamchzn","name":"Adam Chazan"}},"stars":0,"starred":false,"owner":{"type":"team","id":"8dd6422bb0578a38","login":"prayaggordy","name":"Prayag Gordy","avatar_url":"https://avatars-next.observableusercontent.com/cc95f338a0f78c78d1a9090c5e94c5eba102ed6a0d6b2743f31ff43298c3e044","tier":"starter_2024"},"version":805,"publish_version":805,"role":null,"authored":false,"authors":[{"type":"individual","id":"2cb1883273e762ce","login":"prayaggordy","name":"Prayag Gordy","avatar_url":"https://avatars-next.observableusercontent.com/cc95f338a0f78c78d1a9090c5e94c5eba102ed6a0d6b2743f31ff43298c3e044","tier":null}],"members":[{"type":"individual","id":"2cb1883273e762ce","login":"prayaggordy","name":"Prayag Gordy","avatar_url":"https://avatars-next.observableusercontent.com/cc95f338a0f78c78d1a9090c5e94c5eba102ed6a0d6b2743f31ff43298c3e044","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"MD Counties Testing Map","cells":[{"id":0,"value":"md`# MD Counties Testing Map`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"$33","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":264,"value":"getTooltipContents = d => {\n function getlowestfraction(x0) {\n var eps = 0.01;\n var h, h1, h2, k, k1, k2, a, x;\n\n x = x0;\n a = Math.floor(x);\n h1 = 1;\n k1 = 0;\n h = a;\n k = 1;\n\n while (x - a > eps * k * k) {\n x = 1 / (x - a);\n a = Math.floor(x);\n h2 = h1;\n h1 = h;\n k2 = k1;\n k1 = k;\n h = h2 + a * h1;\n k = k2 + a * k1;\n }\n\n return h + \" in \" + k + \" residents\";\n }\n\n return html`

\n \n

${d.properties.NAME}

\n \n

Tests per 100,000 residents

${d3.format(\",.1f\")(\n mdcases.get(d.properties.FIPS)\n )}

${getlowestfraction(\n mdcases.get(d.properties.FIPS) / 100000\n )}

`;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":308,"value":"lineChartWidth = 125","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":310,"value":"lineChartHeight = 50","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":247,"value":"html` \n\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":253,"value":"tooltip = d3.select(\"body\")\n .append(\"div\")\n .attr(\"class\", \"tooltip\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":217,"value":"color = d3.scaleSequential(d3.interpolatePurples).domain(extent)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":502,"value":"scale = d3.scaleSequential(d3.interpolateBlues).domain(extent)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":204,"value":"log = l => Math.log(l+1)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":207,"value":"extent = d3.extent(Array.from(mdcases.values()))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"maryland = FileAttachment(\"mdcounties@2.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":317,"value":"caseTrend = Object.assign(await d3.csv(\"https://raw.githubusercontent.com/prayaggordy/D3-covid-map/master/data/md_counties_cases.csv?token=APZJICOZRHLILJIZFAT5B6C7DDEWM\", d3.autoType)).map(({date, fips, new_cases}) => ({date, fips, new_cases: +new_cases}))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"mdcases = Object.assign(\n new Map(\n await d3.csv(\n \"https://raw.githubusercontent.com/prayaggordy/D3-covid-map/master/data/md_population_tested_county_today.csv\",\n ({ fips, tests_per_100k }) => [fips, +tests_per_100k]\n )\n ),\n { title: \"Maryland Cases\" }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"projection = d3.geoAlbersUsa().scale(1300).translate([487.5, 305])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"path = d3.geoPath()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"topojson = require(\"topojson-client@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 32:"$31:body"