2e:null 2f:["$","title",null,{"children":"NFL Covid Cases – Small Multiples | Nicholas Tahani | Observable"}] 34:T48e,multiples = { const svg = d3.create('svg') .attr('viewBox', [0, 0, 900, 1650]) .attr('font-family', 'sans-serif') const chartContainer = svg .selectAll('path') .data(scaledData) .join('g') .attr('transform', (d, i) => `translate(${(i % 4) * 200}, ${Math.floor(i / 4) * 200})`) const text_g = chartContainer.append('g') svg.append('g') .attr('transform', `translate(${margin.left}, ${margin.top})`) // svg.append('g') // .call(xAxis) chartContainer.append('g') .call(yAxis) chartContainer.append('path') .join('path') .attr('fill', 'none') .attr('stroke', 'steelblue') .attr('stroke-width', 2) .attr('d', lineGenerator) chartContainer.append('text') .attr('font-size', 9) .attr('y', 55) .text('Cases') .style('font-weight', 'bold') .attr('transform', 'translate(20, -20)') text_g.append('text') .data(getChartData) .text(d => d.team) .attr('transform', `translate(${visWidth / 2}, ${visHeight / 3})`) .style('text-anchor', 'middle') .style('font-size', '14px') .style('font-weight', 'bold') return svg.node() }35:[{"id":"1df1699f69076f4ac8f64cc2c19db73c871284f7d19c28f477b110738423bdec6d7c117c3e1e4151469d8743739c2c8b34cae27db5d68efa1171d8cbc5656fb0","href":"https://static.observableusercontent.com/files/1df1699f69076f4ac8f64cc2c19db73c871284f7d19c28f477b110738423bdec6d7c117c3e1e4151469d8743739c2c8b34cae27db5d68efa1171d8cbc5656fb0","name":"nfl_covid@2.csv","type":"text/csv","lastModified":1628896945064.533,"size":15683}] 32:{"id":"238a069dbf5ca3e2","slug":"nfl-covid-cases-small-multiples","title":"NFL Covid Cases – Small Multiples","thumbnail":"7b6781d3e93c709eb63a62ffe9bf80de3c610e8efe87b07a0849ed3ecb80eb04","access_level":"public","create_time":"$D2020-11-11T21:31:28.858Z","update_time":"$D2024-05-11T23:18:56.026Z","view_time":null,"first_public_time":"$D2021-05-26T00:06:56.370Z","has_unpublished_edits":null,"fork":false,"stars":2,"starred":false,"owner":{"type":"team","id":"7cdadd6b49a8f3e0","login":"nicktahani","name":"Nicholas Tahani","avatar_url":"https://avatars-next.observableusercontent.com/189bd6428a8cf525288ae395fd50fe4a2bfd4252fba80403361960889f50daa8","tier":"starter_2024"},"version":1309,"publish_version":1309,"role":null,"authored":false,"authors":[{"type":"individual","id":"0ca9534b318b4d3b","login":"nicktahani","name":"Nicholas Tahani","avatar_url":"https://avatars-next.observableusercontent.com/189bd6428a8cf525288ae395fd50fe4a2bfd4252fba80403361960889f50daa8","tier":null}],"members":[{"type":"individual","id":"0ca9534b318b4d3b","login":"nicktahani","name":"Nicholas Tahani","avatar_url":"https://avatars-next.observableusercontent.com/189bd6428a8cf525288ae395fd50fe4a2bfd4252fba80403361960889f50daa8","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"NFL Covid Cases – Small Multiples","cells":[{"id":674,"value":"md`# NFL Covid Cases – Small Multiples\n---\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1108,"value":"md`Covid cases by team for the 2020-21 NFL season. The charts reflect data from the Preseason through Week 17.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1239,"value":"md`## Some quick findings`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1231,"value":"html`\nThere was a total of ${data.length} cases throughout the season. Of these, Baltimore led all teams with ${max_count} cases, while Seattle and Washington finished with the least amount at ${min_count} cases.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":91,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":151,"value":"xAxis = g => g\n .attr('transform', `translate(0,${600 - margin.bottom})`)\n .call(d3.axisBottom(xScale).ticks(width / 80).tickSizeOuter(0))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":155,"value":"yAxis = g => g\n .attr('transform', `translate(${margin.left},0)`)\n .call(d3.axisLeft(yScale))\n .call(g => g.select('.domain').remove())\n .call(g => g.select('.tick:first-of-type text').remove())","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"xScale = d3.scalePoint()\n .domain(Object.keys(counts.total))\n .range([margin.left, height - margin.right])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":339,"value":"yScale = d3.scaleLinear()\n .domain([0, getYScale])\n .range([height - margin.bottom, margin.top])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":87,"value":"lineGenerator = d3.line()\n .x(d => xScale(d[0]))\n .y(d => yScale(d[1]))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1166,"value":"md`### Chart utils`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":647,"value":"visHeight = 300","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":645,"value":"visWidth = 250","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"margin = ({top: 50, right: 50, bottom: 50, left: 50})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"height = 250","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1161,"value":"md `### Data`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":374,"value":"scaledData = getChartData.map(d => d.data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":249,"value":"getChartData = {\n let data = []\n for (let team in counts) {\n if (team === 'total') continue;\n \n data.push({team: team, data: Object.entries(counts[team])})\n }\n return data\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":208,"value":"getYScale = {\n let currentMaximum = 0 \n\n for (let team in counts) {\n if (team === 'total') continue; //skip for now, want to use same scale for all charts\n // get the counts for all weeks for the team\n const count = Object.values(counts[team]) \n const teamMax = Math.max(...count, currentMaximum)\n currentMaximum = teamMax\n }\n return currentMaximum\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":198,"value":"counts = {\n // { total: {week: 0, caseCount: 100}, TEN: {week: 0, caseCount: 100}, ...}\n let nest = {total: {}}\n\n for (let row of data) { \n if (!nest.total[row.week]) nest.total[row.week] = 0; \n nest.total[row.week]++; \n\n if (!nest[row.team_id]) nest[row.team_id] = {};\n\n if (!nest[row.team_id][row.week]) nest[row.team_id][row.week] = 0;\n \n nest[row.team_id][row.week]++; // e.g. nest = { KC: {0: 5, 1: 10}, ... }\n }\n\n const weekExtent = d3.extent(Object.keys(nest.total), d => +d) // expected output: [0, 14]\n // now, iterate through every team in the nest and add the missing week numbers\n for (let team in nest) { \n const teamObj = nest[team]\n\n for (let i = weekExtent[0]; i < weekExtent[1] + 1; i++) {\n if (!teamObj[i]) teamObj[i] = 0; \n }\n }\n\n return nest\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1270,"value":"max_count = d3.max(nested, d => d.value)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1281,"value":"min_count = d3.min(nested, d => d.value)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1246,"value":"nested = d3.nest()\n .key(d => d.team_id)\n .rollup(d => d.length)\n .entries(data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"data = {\n const text = await FileAttachment('nfl_covid@2.csv').text()\n return d3.csvParse(text, d => ({\n ...d\n }))\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"d3 = require('d3@v5')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 33:"$32:body"