Fork of CovidCases

100%

Fork of CovidCases

✓ Published1🌍 Public

Kkfhujosefsson@dons.usfca.edu

Last edited May 6, 2025

Created on May 5, 2025

This example shows a choropleth map of COVID-19 total cases across Sweden, Denmark, and Norway over time, with a slider to scrub through the available dates. The map uses SVG paths rendered with `d3.geoPath` and a Mercator projection fitted to geographic data from a world GeoJSON file. Each region’s fill color is driven by a `d3.scaleSequential` with `d3.interpolatePlasma`, mapping case counts from a CSV dataset. A tooltip is attached to the paths via mouse events, though it is referenced but not fully instantiated in the provided code, and the slider updates the displayed date label.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

CovidCases

This visualization shows the cumulative number of COVID-19 cases in Sweden, Denmark, and Norway over time, displayed on a geographic map of Scandinavia. A date slider lets viewers scrub through the timeline, with each country colored according to a sequential orange-red scale that encodes case counts. The implementation uses d3-geo and d3.geoPath with a Mercator projection to render the map, while d3.scaleSequential and d3.interpolateOrRd handle the color mapping. Data comes from a JSON world geometry file and a CSV of daily case totals, grouped by date and country. Hovering over a country reveals a tooltip, though its text is not populated.

Kkfhujosefsson@dons.usfca.edu

85% match

Loading thumbnail…

Fork of Multiline chart

This fork of a multiline chart visualizes COVID-19 cases in five Scandinavian countries during October 2020. Each country gets its own small SVG chart displaying daily case counts as a line, with a shared color-coded legend and tooltip. The code uses d3.csv for data loading, d3.group to organize data by country, and d3.line with d3.scaleLinear for axes and paths. A d3-legend library creates the custom legend, and the tooltip appears on hover.

Kkfhujosefsson@dons.usfca.edu

82% match

Loading thumbnail…

Fork of Covid-19

This map visualizes confirmed COVID-19 cases per country as of September 25, 2020, using a sequential color scale applied to a natural Earth projection. It loads country boundaries from the `world-atlas` TopoJSON and case data from a TSV file, then renders each country as an SVG path with a fill color derived from the case count. Hovering highlights a country in red and reveals a tooltip with total cases, deaths, and cases from the last 14 days. The implementation uses d3's `geoPath`, `scaleOrdinal`, and `schemeSpectral`, with custom zoom and interactive color legend controls.

SSaipramod Yerra

81% match

Loading thumbnail…

Fork of Covid-19

A world map uses semitransparent orange circles to show cumulative COVID-19 case counts by country on March 25, 2020. The visualization renders country boundaries as SVG paths via `d3.geoPath` with a `geoMercator` projection, and scales circle radii with `d3.scaleSqrt`. Data comes from a CSV of Johns Hopkins case counts, loaded with `d3.csv`. A range slider is present, but it does not currently change the displayed date.

Ddas888530

81% match

Loading thumbnail…

Fork of Covid-19 Time Series: Total Number of Cases Worldwide Since 01/02/22

A map of cumulative COVID-19 cases worldwide uses a date slider to animate over time. Orange circles, scaled with `d3.scaleSqrt`, are projected onto a mercator globe using `d3.geoProjection` and `d3.geoPath`, with hover tooltips showing country, province, and case counts. The slider controls which date’s data is displayed, and transitions animate circle radius changes. Data is loaded from Johns Hopkins via CSV, with the world map built from TopoJSON features.

SSaipramod Yerra

80% match

Loading thumbnail…

Fork of Circles with D3

This interactive map shows total COVID-19 cases per country on a rotating orthographic globe. The visualization uses D3.js with `d3.geoPath` and `d3.geoOrthographic` to project world GeoJSON data, while a sequential red color scale encodes case counts loaded from a CSV file. Users can hover over countries to see exact case numbers in a tooltip, and drag or auto-rotate the globe through `d3.drag` and `d3.timer`.

MMuhammadsaad.khan@vuw.ac.nz

80% match

Loading thumbnail…

Fork of Fork of Covid-19

This visualization displays a global map of cumulative COVID-19 cases on March 25, 2020, with orange circles sized by the square-root of case counts. Static by default, it includes a date slider that currently does not update the visualization. It loads world country boundaries via TopoJSON and renders them with `d3.geoPath` using a Mercator projection, while plotting case data from a CSV file. The implementation uses `d3.csv`, `d3.scaleSqrt`, `d3.scaleOrdinal`, and `d3.timeParse` to process and encode the data.

Ddas888530

79% match

Loading thumbnail…

Fork of Circles with D3

Two synchronized world maps animate COVID-19 new cases per 100,000 people and vaccination rates over time, using sequential red and green color scales to encode values. Each map includes a play button and slider to scrub through dated records, with the choropleth paths colored from CSV data. The visualization uses D3.js version 3 with `d3.geoNaturalEarth2`, `d3.geo.path` for map projection, TopoJSON from the world-atlas package, and ISO country code mappings to join the data.

SSaipramod Yerra

79% match