2c:null 2d:["$","title",null,{"children":"Confirmed COVID-19 Cases Map Timeline Animation | Kemper Smith | Observable"}] 32:T852,mapSpark = { const mapSVG = d3.select(DOM.svg(width, height)) .attr("id", "svg_sparkline_map") const x1 = margin.left + (state === "Wisconsin" ? 100 : 0) const y1 = margin.top / 2 const x2 = width - margin.right const y2 = height - margin.bottom const extent = [ [x1, y1], [x2, y2] ] const currentDateRows = dataAllRows.filter(d => d.date === formatDate(currentDate)) let total = d3.sum(currentDateRows, d => d[metric]) const chartTitleMain = mapSVG.append("text") .attr("class", "chart-title") .attr("x", margin.left) .attr("y", widthUnder400 ? 10 : 30) .text(`${state} Cumulative COVID-19 Positive Test Results by ${state === "Wisconsin" ? "County" : "Parish"}`) .property("style", titleStyleString) renderMap({ node: mapSVG, extent: extent, mapType: "spark", showCountyLabels: false, legendXPos: width / 2 - 130, legendYPos: width / 2 - 30 }) mapSVG.append("text") .attr("class", "label-map-date") .attr("x", state === "Wisconsin" ? margin.left : width - margin.right - 230) .attr("y", state === "Wisconsin" ? height - margin.bottom - 60 : margin.top) .text(() => { return d3.timeFormat("%B %e")(currentDate) }) mapSVG.append("text") .attr("class", "label-map-metric") .attr("x", state === "Wisconsin" ? margin.left : width - margin.right - 230) .attr("y", state === "Wisconsin" ? height - margin.bottom - 29 : margin.top + 30) .text(() => { if (metric === "cumulative_test_positive") return "Cumulative Positive Tests" else if (metric === "daily_test_positive") return "Daily Positive Tests" else if (metric === "cumulative_deaths") return "Cumulative Deaths" else if (metric === "daily_deaths") return "Daily Deaths" }) mapSVG.append("text") .attr("class", "label-map-metric") .attr("x", state === "Wisconsin" ? margin.left : width - margin.right - 230) .attr("y", state === "Wisconsin" ? height - margin.bottom : margin.top + 60) .text(`All of ${state}: ${d3.format(",")(total)}`) applyChartStyles(mapSVG) return mapSVG.node() }33:T1743,function renderMap({ node = node, extent = extent, mapType = mapType, showCountyLabels = showCountyLabels, legendXPos = legendXPos, legendYPos = legendYPos, } = {}) { const latestDataByCounty = dataAllRows.filter(row => row.date === formatDate(currentDate)) const mapArea = node.append("g") const mapGroup = mapArea.append("g") const paths = mapGroup.append("g") paths.selectAll("path") .data(geoJson.features) .join("path") .attr("fill", countyFillColor) .attr("d", geoPath(extent)) .style("stroke", "white") .style("stroke-width", 1.5) .style("cursor", "pointer") // .on("mouseover", handleMouseOver) // .on("touchmove mousemove", handleMouseMove) // .on("touchend mouseleave", handleMouseLeave) .append("title") .text(d => `${d.properties.NAME} ${state !== "Louisiana" ? "County" : "Parish"}`) const sparkGroups = paths.selectAll(".spark-group") .data([...d3.group(dataAllRows, d => d.county)]) .join("g") .attr("class", "spark-group") .attr("transform", d => { const countyData = geoJson.features.filter(c => c.properties.NAME === d[0]) const [cx, cy] = geoPath(extent).centroid(countyData[0]) const minCountyDate = d3.min(d[1].map(dt => { if (dt[metric] > 0) return parseDate(dt.date) else return currentDate })) const xMove = xScaleSpark(minCountyDate) const yMove = yScaleSpark.range()[0] return `translate(${cx - xMove},${cy - yMove})` }) const sparkStyleString = ` stroke: ${sparklineColor}; stroke-width: 2.5; stroke-opacity: 0.5; fill: none; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; ` const sparkPaths = sparkGroups.append("path") .datum(d => d[1].filter(f => { if (metric.indexOf("test_positive") > -1) { return (f.cumulative_test_positive > 0) && (parseDate(f.date) <= currentDate) } else { return (f.cumulative_deaths > 0) && (parseDate(f.date) <= currentDate) } })) .attr("class", "spark") .attr("d", sparkline) .property("style", sparkStyleString) const sparkText = sparkGroups .append("text") .attr("class", "spark-text") .attr("x", d => xScaleSpark(currentDate) + 3.5) .attr("y", d => { const v = latestDataByCounty.filter(c => c.county === d[0])[0][metric] return yScaleSpark(v) }) .text(d => { const v = latestDataByCounty.filter(c => c.county === d[0])[0][metric] return d3.format(",")(v) }) .property("style", d => { const v = latestDataByCounty.filter(c => c.county === d[0])[0][metric] const vCTP = latestDataByCounty.filter(c => c.county === d[0])[0].cumulative_test_positive const vCD = latestDataByCounty.filter(c => c.county === d[0])[0].cumulative_deaths let display = "block" if (v <= 0 && metric === "cumulative_test_positive") { display = "none" } else if (metric === "daily_test_positive" && vCTP <= 0) { display = "none" } else if (v <= 0 && metric === "cumulative_deaths") { display = "none" } else if (metric === "daily_deaths" && vCD <= 0) { display = "none" } return ` font-size: 9px; display: ${display}; `}) // const sparkLegend = mapArea.append("g") // .attr("transform", () => { // const y = -yScaleSpark.range()[0] + (width * 0.75) // return `translate(${width * 0.8}, ${y})` // }) // .style("display", widthUnder400 ? "none" : "block") // sparkLegend.append("path") // .datum(legendData) // .attr("class", "spark-area") // .attr("d", sparkArea) // .property("style", sparkAreaStyleString) // .attr("transform", `scale(1.6,0.6)`) // sparkLegend.append("path") // .datum(legendData) // .attr("class", "spark") // .attr("d", sparkline) // .property("style", sparkStyleString) // .attr("transform", `scale(1.6,0.6)`) // sparkLegend.append("text") // .attr("class", "label-middle") // .attr("x", () => { // const date = parseDate(legendData[Math.round(legendData.length / 2)].date) // return xScaleSpark(date) * 1.6 // }) // .attr("y", yScaleSpark.range()[0] * 0.6 + 14) // .text("time since first case") // sparkLegend.append("text") // .attr("class", "label") // .attr("x", xScaleSpark(currentDate) * 1.6 + 3) // .attr("y", (yScaleSpark.range()[0] / 2) * 0.6 + 14) // .text("postive") // sparkLegend.append("text") // .attr("class", "label") // .attr("x", xScaleSpark(currentDate) * 1.6 + 3) // .attr("y", (yScaleSpark.range()[0] / 2) * 0.6 + 27) // .text("tests") if (showCountyLabels) { const countyLabels = paths.selectAll(".county-label") .data([...d3.group(dataAllRows, d => d.county)]) .join("text") .attr("class", "map-county-label") .attr("x", 0) .attr("y", d => { const countyData = geoJson.features.filter(c => c.properties.NAME === d[0]) const [[x1, y1], [x2, y2]] = geoPath(extent).bounds(countyData[0]) let dyRatio = 0.2 const moveBy35 = ["Waukesha", "Kenosha", "Marquette", "Eau Claire", "Washington", "Winnebago"] const moveBy15 = ["Iron", "Door", "Ashland", "Green Lake", "Milwaukee", "Marinette"] const moveBy0 = ["Pepin"] if (moveBy35.indexOf(d[0]) > -1) dyRatio = 0.35 else if (moveBy15.indexOf(d[0]) > -1) dyRatio = 0.12 else if (moveBy0.indexOf(d[0]) > -1) dyRatio = 0.0 return (y2 - y1) * dyRatio }) .text(d => d[1][0].county) .attr("transform", d => { const countyData = geoJson.features.filter(c => c.properties.NAME === d[1][0].county) const [cx, cy] = geoPath(extent).centroid(countyData[0]) return `translate(${cx},${cy})` }) } applyChartStyles(mapArea) }34:Tc97,dataAllRows = { let parsedData if (state === "Wisconsin") parsedData = dataWisconsinByCounty else if (state === "Louisiana") parsedData = dataLouisianaByCounty const dataCounty = parsedData.map(d => { let dailyTestPositive = 0 let dailyDeaths = 0 const previousDate = formatDate(d3.timeDay.offset(parseDate(d.date), -1)) const previousDayData = parsedData.filter(c => (c.county === d.county) && c.date === previousDate) if (previousDayData.length === 0) { dailyTestPositive = d.cumulative_test_positive dailyDeaths = d.cumulative_deaths } if (previousDayData.length > 0) { // if previous date exists for county dailyTestPositive = d.cumulative_test_positive - previousDayData[0].cumulative_test_positive dailyDeaths = d.cumulative_deaths - previousDayData[0].cumulative_deaths } return {...d, daily_test_positive: dailyTestPositive, daily_deaths: dailyDeaths } }) const firstDate = d3.min(dataCounty, d => parseDate(d.date)) const lastDate = d3.max(dataCounty, d => parseDate(d.date)) let dates = d3.scaleTime() .domain([firstDate, lastDate]) .ticks(d3.timeDay.every(1)) .map(d => formatDate(d)) const countiesMap = d3.group(dataCounty, d => d.county) const countyNamesFromMap = [...countiesMap.keys()] let finalData = [] dates.forEach((date, i) => { countyNamesFromMap.forEach(d => { let cumulativeTestPositive = 0 let cumulativeTestNegative = "unknown" let cumulativeDeaths = 0 let percentOfAllTests = 0 let percentDeathsOfAllTests = 0 let dailyTestPositive = 0 let dailyDeaths = 0 const dayAndCountyData = dataCounty.filter(day => (day.date === date) && (day.county === d)) if (dayAndCountyData.length > 0) { cumulativeTestPositive = d3.sum(dayAndCountyData, c => c.cumulative_test_positive) cumulativeDeaths = d3.sum(dayAndCountyData, c => c.cumulative_deaths) cumulativeTestNegative = "unknown" if (dataEntireState.filter(day => day.date === date).length > 0) { cumulativeTestNegative = dataEntireState.filter(day => day.date === date)[0].cumulative_test_negative } percentOfAllTests = cumulativeTestPositive / (cumulativeTestPositive + cumulativeTestNegative) if (isNaN(percentOfAllTests)) percentOfAllTests = 0 percentDeathsOfAllTests = cumulativeDeaths / (cumulativeTestPositive + cumulativeTestNegative) if (isNaN(percentDeathsOfAllTests)) percentDeathsOfAllTests = 0 dailyTestPositive = dayAndCountyData[0].daily_test_positive dailyDeaths = dayAndCountyData[0].daily_deaths } const entry = { date: date, county: d, cumulative_test_positive: cumulativeTestPositive, cumulative_test_negative: cumulativeTestNegative, percent_positive_of_all_tests: percentOfAllTests, cumulative_deaths: cumulativeDeaths, percent_deaths_of_all_tests: percentDeathsOfAllTests, daily_test_positive: dailyTestPositive, daily_deaths: dailyDeaths } finalData.push(entry) }) }) return finalData }35:T4c6,function handleMouseOver(d) { const countyNode = d3.select(this) const mapContainer = d3.select(this.parentNode.parentNode.parentNode.parentNode).attr("id") if (mapContainer === "svg_combined") { countyNode.style("stroke", strokeHighlightColor) .style("stroke-width", 3) } else { countyNode.style("fill", "#aaa") } tooltip.style("opacity", 0.9) const latestDataByCounty = dataAllRows.filter(row => row.date === formatDate(maxDateFromData)) const count = latestDataByCounty.filter(c => c.county === d.properties.NAME)[0].cumulative_test_positive const pop = populationDataParsed.filter(c => c.county === d.properties.NAME)[0].population const str = `${d.properties.NAME} County:
${d3.format(",")(count)} case${count === 1 ? "" : "s"} (${d3.format(".3")(count / pop * 10000)} per 10,000 people)` // return `${d.properties.NAME}: ${d3.format(",")(count)} ${d3.format(",")(pop)}` // debug const renderedTooltip = tooltip.html(str) .style("left", () => { const w = parseFloat(tooltip.style("width").replace("px", "")) return `${d3.event.pageX - (w / 2)}px` }) .style("top", (d3.event.pageY - 66) + "px") }36:T64d,function applyChartStyles(e) { e.property("style", ` font-family: "Helvetica", "Arial", sans-serif; `) e.selectAll("svg .label") .property("style", ` font-size: ${widthUnder400 ? 9 : 13}px; `) e.selectAll("svg .label-right") .property("style", ` font-size: ${widthUnder400 ? 9 : 13}px; text-anchor: end; `) e.selectAll("svg .label-middle") .property("style", ` font-size: ${widthUnder400 ? 9 : 13}px; text-anchor: middle; `) e.selectAll("svg .label-value") .property("style", ` font-size: ${widthUnder400 ? 10 : 17}px; font-weight: 800; fill: ${baseColor}; `) e.selectAll("svg .label-map-date") .property("style", ` font-size: ${widthUnder400 ? 20 : 40}px; font-weight: 600; fill: #bbb; `) e.selectAll("svg .label-map-metric") .property("style", ` font-size: ${widthUnder400 ? 14 : 22}px; font-weight: 600; fill: #bbb; `) e.selectAll("svg .y.axis line") .property("style", ` stroke: grey; stroke-dasharray: ${widthUnder400 ? "1,5" : "1,3"}; `) e.selectAll("svg .y.axis text") .property("style", ` font-size: ${widthUnder400 ? 9 : 12}px; `) e.selectAll("svg .label-event") .property("style", ` font-size: ${widthUnder400 ? 9 : 13}px; text-anchor: end; `) e.selectAll("svg .map-county-label") .property("style", ` font-size: 9px; font-weight: 400; font-family: sans-serif; fill: #aaa; text-anchor: middle; pointer-events: none; `) }37:[{"id":"16020f8183b21155f555c6e573ed5ac775a1b7067ca71f9934be6c4fec90caa40fbc590155b5f869f5551023fa816aca2fa019dd52bba4b3aba699099d2a3130","href":"https://static.observableusercontent.com/files/16020f8183b21155f555c6e573ed5ac775a1b7067ca71f9934be6c4fec90caa40fbc590155b5f869f5551023fa816aca2fa019dd52bba4b3aba699099d2a3130","name":"wisconsin-counties.json","type":"application/json","lastModified":1586744053001.987,"size":25029},{"id":"07b465ec3ca54a8f9115ed27ec3f429aca717d5b798bc72b81fab111ecb6ac1f272ce4c37f0bd0f881b201a0f197e615c7aa6c2cf351da21c90c30f2175f0798","href":"https://static.observableusercontent.com/files/07b465ec3ca54a8f9115ed27ec3f429aca717d5b798bc72b81fab111ecb6ac1f272ce4c37f0bd0f881b201a0f197e615c7aa6c2cf351da21c90c30f2175f0798","name":"louisiana-parishes.json","type":"application/json","lastModified":1586835982489.03,"size":24823}] 30:{"id":"51ab81909859a825","slug":"wisconsin-confirmed-covid-19-cases-map-timeline-animation","title":"Confirmed COVID-19 Cases Map Timeline Animation","thumbnail":"1caf3ef49534496a5bd8fef9af24e88a6537bb1b56e9eabfcd69da0166b8d616","access_level":"public","create_time":"$D2020-04-13T02:14:13.001Z","update_time":"$D2020-04-30T02:49:11.865Z","view_time":null,"first_public_time":"$D2020-04-13T07:24:50.779Z","fork":{"id":"9a3bb2d91c945758","slug":"wisconsin-confirmed-covid-19-cases","title":"Wisconsin Confirmed COVID-19 Cases","owner":{"id":"167a7adedc130581","login":"kemper","name":"Kemper Smith"}},"stars":1,"starred":false,"owner":{"type":"team","id":"167a7adedc130581","login":"kemper","name":"Kemper Smith","avatar_url":"https://avatars-next.observableusercontent.com/62a102a58152b7c85d17d4ea9f040c01bd0cb0ae2ebc8b040d43e51a729deee3","tier":"starter_2024"},"version":6276,"publish_version":6276,"role":null,"authored":false,"authors":[{"type":"individual","id":"d015eb85d8c25b2e","login":"kemper","name":"Kemper Smith","avatar_url":"https://avatars-next.observableusercontent.com/62a102a58152b7c85d17d4ea9f040c01bd0cb0ae2ebc8b040d43e51a729deee3","tier":null}],"members":[{"type":"individual","id":"d015eb85d8c25b2e","login":"kemper","name":"Kemper Smith","avatar_url":"https://avatars-next.observableusercontent.com/62a102a58152b7c85d17d4ea9f040c01bd0cb0ae2ebc8b040d43e51a729deee3","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Confirmed COVID-19 Cases Map Timeline Animation","cells":[{"id":0,"value":"md`\n# Confirmed COVID-19 Cases Map Timeline Animation\nNotebook in-progress
\nUpdated on ${d3.timeFormat(\"%B %e, %Y\")(maxDateFromData)}
\nData source: [Wisconsin Department of Health Services](https://www.dhs.wisconsin.gov/outbreaks/index.htm) and
[Louisiana Department of Health](http://www.ldh.la.gov/coronavirus)
(Confirmed cases are likely behind actual cases)\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6134,"value":"viewof state = makeSelect(\"\", [\"Wisconsin\", \"Louisiana\"], \"Select a state\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6036,"value":"viewof metric = {\n const metricsWisc = [\n {label: \"Cumulative Positive Test Results\", value:\"cumulative_test_positive\"},\n {label: \"Daily Positive Test Results\", value: \"daily_test_positive\"},\n {label: \"Cumulative Deaths\", value: \"cumulative_deaths\"},\n {label: \"Daily Deaths\", value: \"daily_deaths\"}\n ]\n \n const metricsLa = [\n {label: \"Cumulative Positive Test Results\", value:\"cumulative_test_positive\"},\n {label: \"Daily Positive Test Results\", value: \"daily_test_positive\"},\n ]\n \n const extraMessage = ` (Past data for deaths is not accurate for Louisiana)`\n \n return makeSelect(\"\", state === \"Wisconsin\" ? metricsWisc : metricsLa, `Select a metric for the timelines${state === \"Louisiana\" ? extraMessage : \"\"}`, 0)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4502,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5999,"value":"viewof currentDate = {\n const firstDate = d3.min(dataAllRows, d => parseDate(d.date))\n const lastDate = d3.max(dataAllRows, d => parseDate(d.date))\n \n let dates = d3.scaleTime()\n .domain([firstDate, lastDate])\n .ticks(d3.timeDay.every(1))\n \n const scrubberOptions = {\n autoplay: true,\n loop: false,\n alternate: false,\n delay: state === \"Louisiana\" ? 160 : null, //milliseconds\n format: date => d3.timeFormat(\"%B %e\")(date)\n }\n \n return Scrubber(dates, scrubberOptions)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3192,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4355,"value":"geoJson = {\n let file, path\n \n if (state === \"Wisconsin\") {\n file = wisconsinCountyTopo\n path = \"cb_2015_wisconsin_county_20m\"\n }\n else if (state === \"Louisiana\") {\n file = louisianaParishTopo\n path = \"cb_2015_louisiana_parish_20m\"\n }\n \n return topojson.feature(file, file.objects[path])\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3203,"value":"function geoPath(extent) {\n const projection = d3.geoMercator()\n .fitExtent(extent, geoJson)\n \n return d3.geoPath()\n .projection(projection)\n // .projection(d3.geoMercator().scale(scale))\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5387,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5580,"value":"maxDateFromData = d3.max(dataAllRows.map(d => parseDate(d.date)))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"counties = d3.group(dataAllRows, d => d.county)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"countyNames = [...counties.keys()]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4907,"value":"tooltip = d3.select(\"body\").append(\"div\")\n .attr(\"class\", \"tooltip\")\n .property(\"style\", `\n opacity: 0;\n position: absolute;\n font-size: 0.7em;\n font-family: sans-serif;\n font-weight: 400;\n padding: 4px;\n background: white;\n border: solid 1px #999;\n border-radius: 3px;\n pointer-events: none;\n `)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5275,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4910,"value":"function handleMouseMove(d) {\n const renderedTooltip = tooltip\n .style(\"left\", () => {\n const w = parseFloat(tooltip.style(\"width\").replace(\"px\", \"\"))\n\n return `${d3.event.pageX - (w / 2)}px`\n })\n .style(\"top\", (d3.event.pageY - 66) + \"px\")\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4914,"value":"function handleMouseLeave(d) {\n const mapContainer = d3.select(this.parentNode.parentNode.parentNode.parentNode).attr(\"id\")\n \n if (mapContainer === \"svg_combined\") {\n d3.select(this).style(\"stroke\", \"#ACC2D4\")\n .style(\"stroke-width\", 0.5)\n }\n else {\n d3.select(this).style(\"fill\", countyFillColor)\n }\n\n // tooltip.transition()\t\t\n // .duration(200)\t\t\n // .style(\"opacity\", 0)\n \n tooltip.style(\"opacity\", 0)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4574,"value":"xScaleSpark = {\n let sparkDistance = 60\n \n return d3.scaleTime()\n .domain([d3.timeDay.offset(minDate, + 0), maxDateFromData])\n .range([0, sparkDistance])\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4579,"value":"yScaleSpark = {\n const maxOfAllCounties = d3.max(dataAllRows.map(d => d[metric]))\n \n return d3.scaleLinear()\n .domain([0, maxOfAllCounties])\n .range([200, 0])\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4536,"value":"sparkline = d3.line()\n .x(d => xScaleSpark(parseDate(d.date)))\n .y(d => {\n // const pop = populationDataParsed.filter(p => p.county === d.county)[0].population\n\n return yScaleSpark(d[metric])// / pop * 10000)\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":754,"value":"minDate = d3.min(dataAllRows.map(d => parseDate(d.date)))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2116,"value":"widthUnder400 = width < 640 ? true : false // 450","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":565,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1754,"value":"titleStyleString = `\n font-family: \"Source Serif Pro\", \"Georgia\", sans-serif;\n ${widthUnder400 ? \"font-size: 14px\" : \"font-size: 24px\"};\n font-weight: 700;\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1749,"value":"titleLocationStyleString = `\n font-family: \"Source Serif Pro\", \"Georgia\", sans-serif;\n ${widthUnder400 ? \"font-size: 12px\" : \"font-size: 24px\"};\n font-weight: 700;\n fill: ${baseColor};\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3212,"value":"wisconsinCountyTopo = {\n const topo = await FileAttachment(\"wisconsin-counties.json\").json()\n \n const newTransform = {\n translate: [0, 0],\n scale: [0.0017, 0.0017]\n }\n \n let alteredTopo = {\n type: topo.type,\n transform: newTransform,\n arcs: topo.arcs,\n objects: topo.objects\n }\n \n return alteredTopo\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6141,"value":"louisianaParishTopo = {\n let topo = await FileAttachment(\"louisiana-parishes.json\").json()\n \n topo.objects.cb_2015_louisiana_parish_20m.geometries[53].properties.NAME = \"La Salle\"\n \n return topo\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"parseDate = d3.timeParse(\"%Y-%m-%d\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":238,"value":"formatDate = d3.timeFormat(\"%Y-%m-%d\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":63,"value":"margin = ({\n \"top\": widthUnder400 ? 30 : 100, // 30 : 66,\n \"right\": widthUnder400 ? 27 : 44,\n \"bottom\": widthUnder400 ? 18 : 20,\n \"left\": widthUnder400 ? 0 : 10\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5426,"value":"viewof countyFillColor = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5446,"value":"viewof sparklineColor = html`` //#333333","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1176,"value":"baseColor = \"steelblue\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1238,"value":"deathsColor = \"#C41B1B\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5692,"value":"height = 600","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5140,"value":"strokeHighlightColor = \"#D800C2\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6156,"value":"import {dataByCountyParsed as dataLouisianaByCounty, populationDataParsed as louisianaPopulationDataParsed} from \"@kemper/louisiana-confirmed-covid-19-cases\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5584,"value":"import {dataByCountyParsed as dataWisconsinByCounty, populationDataParsed, dataEntireState} from \"@kemper/wisconsin-confirmed-covid-19-cases\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5994,"value":"import {Scrubber} from \"@mbostock/scrubber\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"import {makeSelect, makeSliderWithValue} from \"@kemper/code-snippets\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3197,"value":"topojson = require(\"topojson-client@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"d3 = require(\"d3@5\", \"d3-array@^2.2\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W37","stdlib":"1","titling":"auto"}} 31:"$30:body"