Skip to main content
SimilarExport ZIP
100%

Final Project

✓ Published0🌍 Public
Pphemmati
Last edited May 13, 2020
Created on May 12, 2020
Forked from HTML Starter

This interactive choropleth map displays the worldwide incidence of COVID-19 cases and deaths over time. Users can hover over countries for tooltip details or click to isolate a country, while moving the mouse below the map scrubs through dates from January to May 2020. The visualization uses D3 v5 with `d3.geoNaturalEarth` projections and `d3.geoPath` for rendering the SVG map, with a log-scale color encoding for case counts and a line graph for temporal trends. Data is loaded from external GeoJSON and JSON files.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Final project

This visualization presents a comparative view of the global COVID-19 pandemic through two side-by-side choropleth maps. One map displays the monthly incidence rate of new COVID-19 cases per 100,000 inhabitants, using a red sequential color scale, while the other shows the vaccination rate using a green scale. Both maps feature a play button and a draggable slider to animate through time from January 2020 to May 2021. The geographic data is rendered using the `d3.geoPath` projection with Natural Earth and TopoJSON, and the temporal data is sourced from Our World in Data.

Hhaneesh@gctc.in
86% match
Loading thumbnail…

Final Project

This interactive choropleth map shows cumulative COVID-19 cases per U.S. state as of September 2021, with darker fills representing higher case counts. Clicking a state displays a tooltip with its name, total cases, and total deaths. The visualization loads county-level data from a CSV via `d3.csv`, aggregates it by state using `d3.rollup`, and renders SVG paths from TopoJSON using `d3.geoPath`. Color opacity is scaled proportionally to each state’s case total, with a bivariate legend circle appended on click.

MManh Pham
83% match
Loading thumbnail…

d3 choropleth map

This interactive choropleth map visualizes the spread of COVID-19 cases across countries over time, using an animated timeline that cycles through daily data from January to July 2020. The map renders world country boundaries as SVG paths using the Eckert5 projection, with each country’s fill color dynamically updated based on its reported case count for the currently displayed date. Built with D3 v3, it leverages `d3.geo.path`, `d3.geo.eckert5`, `d3.geo.graticule`, TopoJSON for geographic data, and a CSV dataset, while a play button and date label drive the sequential animation.

Aashpradhan01123
83% match
Loading thumbnail…

Choropleth map

This choropleth map visualizes COVID-19 cases, deaths, and recent 14-day case counts by country, using color to encode case numbers and hover tooltips to reveal detailed statistics. The map uses `d3.geoNaturalEarth1` projection with `d3.geoPath` to render world geography, while `d3.scaleOrdinal` with `schemeSpectral` assigns colors to case values. Data is loaded from a TSV file and TopoJSON world atlas, processed with `topojson.feature`, and rendered as SVG paths. A custom color legend and `d3.zoom` are also implemented.

VVaggelisKlt
83% match
Loading thumbnail…

CVOID-19 Data

This interactive choropleth map displays cumulative and current COVID-19 case counts by country, with a toggle between the two metrics and a color-coded legend showing case severity bins. Built with D3.js, it uses `d3.geoNaturalEarth1` projection, `d3.geoPath` for rendering country boundaries, and `topojson.feature` for geographic data processing. The map pulls CSV data from a GitHub gist and GeoJSON from andybarefoot’s map data, coloring countries via `d3.scaleOrdinal` with a red sequential scheme. Users click buttons to switch between cumulative and existing (cases minus deaths) patient counts.

Zzhangfa
82% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes global COVID-19 cumulative case counts by country, with each nation shaded according to its reported total. The map uses a natural Earth projection and is rendered as SVG, with a zoom interaction allowing users to inspect regions in detail. Data comes from a CSV file joined with world country boundaries from the World Atlas TopoJSON, while colors are assigned via d3.scaleOrdinal with a spectral scheme. Hovering reveals the country name and case count through an SVG title element.

Ggcappadaniel
82% match
Loading thumbnail…

My Project

This project visualizes COVID-19 case data on a zoomable natural Earth projection map, with a toolbox interface for filtering different metrics. The visualization uses d3.geoPath and d3.geoNaturalEarth1 to render world countries from TopoJSON data, while a separate chart area and toolbox are built with SVG elements and d3 transitions. Data is loaded asynchronously from the world-atlas and a COVID-19 CSV dataset, and the map supports pan and zoom via d3.zoom.

DDaniel García
81% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes the global distribution of COVID-19 cases using a red and green color scheme, with each country’s fill color indicating the presence of cases on a specific date. The map is rendered with SVG using D3’s `geoNaturalEarth1` projection and `geoPath` for geographic outlines, while `zoom` enables interactive panning. Data is loaded from a CSV file and merged with TopoJSON world geometry via `loadAndProcessData`, and a custom `colorLegend` component displays the categorical scale.

NNodirbek Parpibaev
81% match