Skip to main content
SimilarExport ZIP
100%

Choropleth Map

✓ Published2🌍 Public
Bbeca8675
Last edited May 6, 2020
Created on Apr 20, 2020
Forked from HTML Starter

A choropleth map visualizes epidemic risk across countries, using color intensity to show the P2P risk index and a legend with ordinal color swatches. The map is rendered with SVG paths generated by `d3.geoPath` and a `geoNaturalEarth1` projection, with TopoJSON data from the World Atlas and risk data from a CSV file. Hovering highlights a country, and missing data appears gray. Users can zoom and pan the map via `d3.zoom`, while `scaleOrdinal` and `schemeRdPu` drive the color encoding.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth Map

A choropleth map visualizes epidemic risk class by country, using color to indicate risk levels from low to very high. Drawn with d3.geoPath and a natural Earth projection, the map supports pan and zoom, with hover tooltips displaying country, risk class, and rank. Data comes from a CSV file joined with world-atlas TopoJSON. A legend uses d3.scaleOrdinal and the RdPu color scheme to explain the ordinal classes.

Bbeca8675
96% 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
86% 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
86% match
Loading thumbnail…

Choropleth map

A choropleth map of COVID-19 cases by country, with each nation colored on a spectral scale via `d3.scaleOrdinal` and `d3.schemeSpectral`. Hovering highlights a country in red, and a click-drag zoom uses `d3.zoom` with a Natural Earth projection (`d3.geoNaturalEarth1`) and `d3.geoPath`. Data loads from a CSV and TopoJSON using `d3.csv`, `d3.json`, and `topojson.feature`; a custom color legend renders SVG circles and text.

VVaggelisKlt
86% match
Loading thumbnail…

Choropleth Map

A choropleth map colors countries by economic grouping, with a legend of colored circles and a natural Earth projection. It uses d3.geoPath, d3.geoNaturalEarth1, d3.scaleOrdinal with schemeSpectral, and d3.zoom for panning. The code loads world atlas TopoJSON and TSV data via topojson.feature, rendering country paths as SVG with hover highlighting.

Ggorfoula
85% match
Loading thumbnail…

Choropleth Map

A choropleth map uses color to encode values across world countries. D3’s `geoPath` and `geoNaturalEarth1` projection render the map from TopoJSON data, while a TSV file supplies per-country attributes. The map color-fills each country by its `scalerank` value using an ordinal color scale. A separate legend component displays the color-to-value mapping, and zooming is enabled via the `zoom` event.

AAdrian Herzog
85% match
Loading thumbnail…

Choropleth Map

A choropleth map colors countries by their economic classification using an ordinal color scale with the `schemeSpectral` palette. The visualization uses `d3.geoNaturalEarth1` and `d3.geoPath` to render world geography, with data loaded from the World Atlas TopoJSON and TSV files via `d3.json` and `d3.tsv`. A custom color legend displays the scale, and zooming is enabled through `d3.zoom`. Hovering highlights a country by turning it red.

CChip
85% match
Loading thumbnail…

Choropleth Map

A world choropleth map colors each country by its economy category using an ordinal color scale. The visualization uses d3 geoNaturalEarth1 projection with d3.geoPath to render countries from TopoJSON data, enriched with world-atlas TSV metadata. A custom color legend component displays the categories, and d3.zoom enables interactive panning and zooming. Country outlines appear in black, with hover effects highlighting individual nations in red.

FFlorian Breitwieser
85% match