Skip to main content
SimilarExport ZIP
100%

D3 Choropleth Map

✓ Published1🌍 Public
Rrdeichert
Last edited Dec 16, 2019
Created on Dec 16, 2019

This D3 Choropleth Map colors world countries by their economic classification, using a spectral color scale and a geospatial natural Earth projection. The visualization includes an interactive legend with circles and labels, while zoom and pan are enabled via d3.zoom. Data is loaded from TopoJSON and TSV files using d3.json and d3.tsv, with country paths generated by d3.geoPath. The map is rendered as SVG, and hovering over a country turns it red, with tooltips showing name and economy value.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth Map

This choropleth map colors world countries by their economic classification using a categorical color scale derived from d3.scaleOrdinal and d3.schemeSpectral. It draws geographic boundaries with d3.geoPath and a natural Earth projection, with hover highlighting and zooming via d3.zoom. Country metadata—including economy and income group—comes from a TSV file joined to TopoJSON geometry, and a custom legend component renders the color domain as circles with labels.

DD.A
94% match
Loading thumbnail…

Choropleth Map

This choropleth map colors world countries by their economic classification using a categorical color scale derived from d3.scaleOrdinal and d3.schemeSpectral. It draws geographic boundaries with d3.geoPath and a natural Earth projection, with hover highlighting and zooming via d3.zoom. Country metadata—including economy and income group—comes from a TSV file joined to TopoJSON geometry, and a custom legend component renders the color domain as circles with labels.

DD.A
94% match
Loading thumbnail…

Choropleth Map

This choropleth map colors world countries by their economy classification using an ordinal color scale with the spectral scheme. The visualization supports zooming and panning through D3’s zoom behavior, while hover effects highlight individual countries. It renders geographic boundaries with d3.geoPath and a Natural Earth projection, and includes a custom color legend built with SVG circles and text. Data is loaded from the World Atlas TopoJSON and TSV files, processed via topojson.feature, and joined by country ID.

Nnouralkhoury
94% match
Loading thumbnail…

Choropleth Map

This choropleth map colors countries by economic classification using a categorical ordinal scale with the Spectral scheme. It loads world geometry from TopoJSON and joins it with TSV metadata, then renders the map with d3.geoPath and a Natural Earth projection. The visualization includes an interactive color legend built with custom SVG components, and supports zooming and panning through d3.zoom. Hovering highlights individual countries in red, and tooltips display each country’s name and economic group.

Ddata-inside
94% match
Loading thumbnail…

Choropleth Map

This choropleth map colors countries by economic classification using an ordinal color scale derived from d3.scaleOrdinal and d3.schemeSpectral. The visualization renders geographic boundaries with d3.geoPath and a natural Earth projection, with zooming enabled via d3.zoom. Hover effects highlight individual countries, and a custom color legend built with SVG circles and text explains the color categories. Country names and economic data are loaded from TopoJSON and TSV files using d3.json and d3.tsv.

JJaloYang
94% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes the economies of world countries using a spectral color scale. The implementation uses d3.geoPath with the natural Earth projection to render world geometry from TopoJSON and TSV data sources. The custom d3.scaleOrdinal color legend displays circles and text labels, while the map supports zooming through d3.zoom. Each country is colored by its economy value with hover effects that turn the landmass red, and tooltips reveal the country name and associated economic classification.

CChristine Lanser
93% match
Loading thumbnail…

Choropleth Map

This choropleth map colors countries by their economy classification, with a color legend and tooltips showing each country’s name and category. The visualization uses a natural Earth projection rendered as SVG paths via d3.geoPath, while TopoJSON and TSV data from the world-atlas package are loaded asynchronously. Users can pan and zoom the map using d3.zoom, and hovering highlights individual countries in red. The color scale uses d3.scaleOrdinal with a spectral scheme, and an interactive legend is built from custom d3 selections.

BBrandon Lehr
93% match
Loading thumbnail…

d3 Choropleth Map

This choropleth map colors countries by economic classification using a spectral color scale, with a legend showing the ordinal categories and hover effects highlighting individual countries. The map is rendered as an SVG using d3.geoPath with a geoNaturalEarth1 projection, while d3.zoom enables interactive panning and zooming. Data is loaded from the world-atlas TopoJSON and TSV files via topojson.feature, and the color legend is built custom with d3.scaleOrdinal and d3.schemeSpectral.

Aaslamluqman
93% match