ssingh175

@ssingh175·5 public vizzes

Untitled

This scatter plot displays COVID-19 deaths and vaccination rates across US states over time, sourced from the New York Times rolling-averages dataset. The chart uses D3 version 6.7.0 with reusable chart architecture, implementing scaleTime and scaleLinear scales, axisBottom and axisLeft components, and timeFormat for date labels. Custom annotations highlight the United States title and a 30% vaccination threshold. The code imports data via d3.csv and builds circles with selectAll and join patterns, while demonstrating a modular scatterPlot factory function with getter-setter accessors.

Jun 1, 2021

Loading thumbnail…

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

This reusable D3 scatter plot framework visualizes COVID-19 deaths in the United States over time, using data from the NY Times rolling-averages dataset. Built with D3 v6.7.0, it employs `scaleTime`, `scaleLinear`, `axisLeft`, and `axisBottom` to render circles for each data point, with dual time-based axis formats showing months and years. The chart includes custom text annotations for the title, source, and a vaccination threshold marker. A separate `data.csv` file demonstrates the framework's flexibility with population data from multiple countries.

Jun 1, 2021

Loading thumbnail…

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

This example shows COVID-19 deaths in the United States over time as a scatter plot, using a reusable D3 chart framework. It displays each data point as a circle scaled by population, with a time-based x-axis and linear y-axis for death counts, along with labels for vaccination milestones and a source citation. The chart uses D3 v6 modules such as `scaleTime`, `scaleLinear`, `axisBottom`, and `axisLeft` from `d3`, and loads data from the NY Times COVID-19 dataset via `d3.csv`. The implementation follows the reusable chart pattern with getter-setter accessors for width, height, data, and margins.

Jun 1, 2021

Loading thumbnail…

Fork of Making a Bar Chart

This chart visualizes daily COVID-19 death totals over time, derived from the Johns Hopkins CSSE time-series dataset. The line chart plots dates on the x-axis against cumulative global deaths on the y-axis. The code uses React to manage the component lifecycle, with `useData` fetching the CSV via `d3.csv` and transforming it using `timeParse` and array methods. The rendered line is drawn as an SVG path within a React-based `LineChart` component.

Jun 1, 2021

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars, with each circle representing a vehicle from the auto-mpg dataset. The code uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to construct the axes, while `csv` loads the data from a remote URL. Each data point is appended as an SVG circle, with styling applied via CSS for fill color and opacity. The visualization includes labeled axes and a title, demonstrating how D3 handles margin-based layouts and custom tick formatting in an SVG rendering.

May 31, 2021