Skip to main content
SimilarExport ZIP
100%

Fork of #4 COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

✓ Published0🌍 Public
CCurran Kelleher
Last edited May 29, 2021
Created on May 29, 2021

This interactive scatter plot animates COVID-19 rolling averages for the United States, toggling between case and death counts over time. It uses the D3.js library with `scaleTime` and `scaleLinear` for axes, `transition` for smooth animations, and `selectAll().join()` for incremental updates. The visualization cycles between metrics every 2.4 seconds, slowing updating circle positions with a staggered delay effect. Data comes from the NY Times rolling-averages CSV, rendered as SVG.

AI-generated description

A reusable scatter plot inspired by Towards Reusable Charts.

Shows the NY Times Covid-19 Dataset US .

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of #4 COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

This animated scatter plot tracks COVID-19 deaths and case averages across the United States using a reusable D3 chart framework. The visualization cycles between two metrics every five seconds, transitioning circles smoothly along the time-based x-axis and linear y-axis. Data comes from the NY Times rolling averages dataset, rendered as SVG circles with a dual-axis format showing month labels and annual year markers. The chart uses D3 v6.7 APIs including `scaleTime`, `scaleLinear`, `axisBottom`, and `transition` to handle the temporal updates and animated position changes.

Sserebryanaya.n@gmail.com
97% match
Loading thumbnail…

Fork of #4 COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

This fork of a D3 scatter plot animates US COVID-19 rolling averages. The chart plots time on the x-axis and cycles between two y-axis metrics, cases_avg and deaths_avg, with circles animating to new positions. It uses a reusable `scatterPlot` function with d3 `scaleTime` and `scaleLinear` scales, `axisLeft` and `axisBottom` axes, and transitions on circle positions. The data is loaded via d3 `csv` from the NYT rolling-averages repository.

Bbhanuteja1807@gmail.com
96% match
Loading thumbnail…

Fork of #3 COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

This chart plots daily COVID-19 deaths and case averages across the US using NY Times rolling-averages data. An animated scatter plot, it cycles between two metrics every 2.4 seconds, with circles updating smoothly via D3’s `transition`. The reusable framework, built with `scatterPlot.js`, leverages `scaleTime` and `scaleLinear` for axes, plus `axisLeft`, `axisBottom`, and `timeFormat` for labeling. SVG rendering and the `d3.select` API manage the dynamic visualization.

DDasbach.EJ
95% match
Loading thumbnail…

Fork of #4 COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

Drawing on New York Times rolling COVID-19 data for the United States, this animated SVG scatter plot uses the reusable D3 chart pattern to toggle between average case and death counts every 2.4 seconds. It employs `d3.scaleTime` and `d3.scaleLinear` for axes, with `d3.transition` animating circle positions and y-axis label updates. The chart highlights the vaccination milestone at 30% and sources data from the NYT GitHub repository.

DDasbach.EJ
95% match
Loading thumbnail…

#4 COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

This animated scatter plot visualizes COVID-19 deaths and cases in the United States using New York Times rolling averages data. The visualization alternates between displaying average cases and average deaths on the y-axis every 2.4 seconds, with each data point representing a date. Built with D3 v6, the reusable chart uses `scaleTime` and `scaleLinear` for axes, `axisBottom` with `timeFormat` for month and year labels, and `transition()` with staggered delays for smooth circle repositioning. SVG rendering displays the full timeline with circles growing from radius zero via `transition.attr('r', radius)`.

DDasbach.EJ
93% match
Loading thumbnail…

#2 COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

This animated scatter plot displays COVID-19 death and case averages across the United States over time, using rolling data from the New York Times. The visualization toggles between deaths and cases every 2.4 seconds, smoothly transitioning circles along the y-axis while the x-axis remains a time scale. Built with reusable D3.js chart components, the code leverages `scaleTime`, `scaleLinear`, `axisBottom`, and `axisLeft` to render the SVG. A `transition` with staggered delays animates circle positions, while `d3.csv` loads the NYT rolling-averages dataset directly from GitHub.

DDasbach.EJ
93% match
Loading thumbnail…

COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

The visualization animates daily COVID-19 mortality and case averages across the United States using NYT rolling-averages data. A reusable D3 scatter plot framework, built with `scaleTime`, `scaleLinear`, and `axisBottom`, transitions circles smoothly between the two metrics every 2.4 seconds. The SVG rendering displays month and year tick labels, a y-axis label, and a vaccination milestone annotation. It uses `selectAll`, `data().join()`, and `transition().delay()` to update positions and redraw axes.

TToly
93% match
Loading thumbnail…

#5 COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework Animated

This animated scatter plot visualizes COVID-19 case and death averages across the United States using New York Times rolling-averages data. The D3.js chart transitions between two y-axis metrics—deaths_avg and cases_avg—on a timed interval, with circles positioned by date and value. It uses d3.scaleTime, d3.scaleLinear, d3.axisBottom, and d3.axisLeft, with transitions updating circle positions and axis labels. SVG rendering displays the full timeline with monthly and yearly tick formats, while the reusable scatterPlot function follows the Towards Reusable Charts pattern.

DDasbach.EJ
92% match