Skip to main content
SimilarExport ZIP
100%

Interactive Bar Charts for Various COVID 19 Stats in the US

✓ Published0🌍 Public
MManh Pham
Last edited Dec 5, 2021
Created on Oct 7, 2021

This interactive bar chart displays COVID-19 statistics for 20 US counties, showing metrics like confirmed cases and deaths selected via a dropdown menu. The bars are sorted by ascending death counts. Built with D3.js v6, it uses `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render the SVG visualization. Data comes from a New York Times dataset loaded as a CSV, with user interactions handled through a custom menu component using D3’s `dispatch` for change events.

AI-generated description

This is an example visualization desgined for the COVID-19 dataset by New York Times. The data for confirmed deaths in the first 10 rows of the dataset corresponding to these 20 counties were selected and visualized in the form of a bar chart

Source of data can be found in my data Gist here

Update (Iterate your work): The bar chart can now be displayed in order of increasing number of deaths

MIT Licensed

Similar vizzes

Loading thumbnail…

COVID-19

This interactive D3.js visualization displays COVID-19 metrics over time for selected countries, allowing viewers to toggle between confirmed cases, deaths, and recoveries via two dropdown menus. The line chart uses a time-based x-axis and a linear y-axis, with a single red, blue, or green line rendered per selection. Data is loaded from a CSV file, processed by nesting and grouping entries by date, and filtered by country. The visualization uses D3's `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` for smooth curves.

WW9183907
82% match
Loading thumbnail…

Bar Chart Covid Data Manh Pham

This bar chart displays the confirmed COVID-19 death counts for ten counties, sourced from New York Times data hosted in a GitHub Gist. The visualization uses D3 v7’s `scaleLinear` and `scaleBand` to map death counts to horizontal bar lengths and county names to vertical positions, respectively. The SVG renders steelblue rectangles with axes generated via `axisLeft` and `axisBottom`. The chart adapts to the browser window size, with margins and data sliced to the first ten rows of the CSV file.

MManh Pham
82% match
Loading thumbnail…

COVID-19 US Interactive

This interactive line chart displays the rolling seven-day average of COVID-19 cases in the United States over time. The visualization uses React and D3 v6, with the data sourced from the New York Times’ public COVID-19 repository. The chart plots dates on the x-axis and average cases on the y-axis, rendered as an SVG using custom `AxisBottom`, `AxisLeft`, and `Marks` components. Hovering over data points triggers a `Tooltip` showing the formatted value. The code leverages D3’s `scaleTime`, `scaleLinear`, and `csv` for data parsing and scaling.

DDasbach.EJ
82% match
Loading thumbnail…

COVID-19 Deaths in US Interactive

A COVID-19 deaths scatter plot for the United States renders the NY Times rolling-averages dataset as an interactive SVG visualization. The chart, built with React and D3 v6, uses d3.scaleTime and d3.scaleLinear to map dates against the seven-day average death count. It displays axes via d3.axisLeft and d3.axisBottom, with labeled annotations for the country title, y-axis, and vaccination threshold. The reusable chart pattern from "Towards Reusable Charts" is implemented through configurable accessor functions, while the data loads asynchronously from a CSV URL and updates circle elements via selection.join.

DDasbach.EJ
81% match
Loading thumbnail…

COVID-19

This interactive COVID-19 dashboard displays country-level statistics using horizontal bars. Users select an attribute from a dropdown, and React state updates the chart to show that metric. Driven by a CSV of global pandemic data, the visualization renders bars with SVG rectangles via React components, using D3 scales (`scaleBand`, `scaleLinear`) and axes (`AxisBottom`, `AxisLeft`) to position the data. Tooltips appear on hover through SVG `<title>` elements.

WW9183907
81% match
Loading thumbnail…

COVID chart

The bar chart displays the rate of coronavirus cases per 100,000 habitants for nine U.S. counties, ordered from highest to lowest, using a green fill for each rectangle. It uses D3 v5’s `scaleLinear` for the x-axis, `scaleBand` for the y-axis, and `axisLeft`/`axisBottom` to render the axes. Data is loaded from `data.csv` via `csv` and appended as SVG rectangles. The source is Elflein (June 2020) via Statista.

Mmla341
80% match
Loading thumbnail…

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

This interactive scatter plot displays the seven-day rolling average of COVID-19 deaths in the United States over time, using data from the New York Times. Built with D3.js, it employs a reusable scatter plot framework where the x-axis represents dates and the y-axis shows the death average per day. The visualization includes labeled axes, a title, and a source attribution. The SVG rendering uses D3 scales, axes, and circles, with data loaded from a remote CSV file parsed through D3's csv function.

Ccssergio
80% match
Loading thumbnail…

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

This animated scatter plot visualizes the rolling seven-day average of COVID-19 deaths and cases across the United States, drawing on data from the New York Times. The visualization, built with the D3.js library, employs a reusable chart framework with a `scatterPlot()` function. Using SVG rendering, it animates the transition between metrics, toggling between death and case averages every few seconds. The chart includes labeled axes, a title, and a source attribution, with the y-axis label updating to reflect the current metric.

DDasbach.EJ
80% match