Skip to main content
SimilarExport ZIP
100%

Choropleth Map

✓ Published3🌍 Public
HHe Jianfeng
Last edited Apr 11, 2021
Created on Apr 11, 2021

This choropleth map colors world countries by income group, using a spectral color scale with a legend showing the categorical ranges. It renders country boundaries as SVG paths via the `d3.geoPath` and `d3.geoNaturalEarth1` projections, with a zoom interaction applied through `d3.zoom`. Data comes from the `world-atlas` TopoJSON and TSV files, processed with `topojson.feature` to merge attributes. Hovering highlights a country in red and displays its name and income group in a tooltip.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth map

This choropleth map colors world countries by income group using a spectral ordinal scale, with a hover effect that highlights individual country borders and a legend showing the color categories. The visualization uses d3.geoNaturalEarth1 and d3.geoPath to render TopoJSON world-atlas data, while d3.zoom enables panning and interactive exploration. Color encoding and the legend are built with d3.scaleOrdinal and d3.schemeSpectral, with data loaded via d3.tsv and d3.json.

JJames Malvern
95% match
Loading thumbnail…

Choropleth Map

A choropleth map colors world countries according to their income group, using a spectral color scale. The map is rendered as an SVG with a natural Earth projection, and hovering highlights a country in red. Built with d3.v5 and topojson, it loads geographic data from the World Atlas TopoJSON files alongside a TSV table of income classifications. The code uses `d3.geoPath`, `d3.geoNaturalEarth1`, `d3.zoom`, and a custom `colorLegend` component that maps ordinal color values to circles and labels.

AArriannePandaraoan
95% match
Loading thumbnail…

Choropleth Map

This choropleth map colors world countries by income group, using a spectral color scale with an accompanying legend. The visualization is built with D3.js, using `d3.geoPath` and `d3.geoNaturalEarth1` for map projection and rendering, and `zooming` via `d3.zoom` event handling. Country data comes from the `world-atlas` package, with income group information joined from a TSV file, and the map supports hover highlighting.

Iianleekq
95% match
Loading thumbnail…

Choropleth Map

This choropleth map colors countries by income group using a red-blue ordinal color scale, with a zoomable Natural Earth projection rendered as SVG paths. It loads world country boundaries from the World Atlas TopoJSON dataset and joins them to TSV metadata by ISO country code. The map includes an interactive color legend built with custom D3 selections, and uses d3.geoPath, d3.geoNaturalEarth1, d3.zoom, and d3.scaleOrdinal with schemeRdBu. Hovering highlights individual countries, and a title tooltip shows each country’s name and income group.

AAdrian Tan
95% match
Loading thumbnail…

Choropleth Map

This choropleth map colors world countries by income group using a categorical color scale with a spectral scheme. The visualization supports zooming and panning through d3.zoom, with country names and income groups revealed via tooltips on hover. Built with d3.geoPath and geoNames from the world-atlas TopoJSON dataset, it renders as SVG paths over a blue sphere. A custom color legend component displays the ordinal scale’s domain, while hover interactions highlight individual countries in red.

Mmla341
95% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes global income groups by coloring countries with a spectral color scale. It uses `d3.geoNaturalEarth1` projection and `d3.geoPath` to render the world map from TopoJSON data loaded via `world-atlas`. The map supports zooming through d3’s zoom behavior, and an accompanying legend built with `colorLegend` displays the ordinal scale values. Country data is joined from a TSV file, and hovering highlights each nation while a tooltip title shows its name and income group.

Ssteveaigbe
95% match
Loading thumbnail…

Choropleth map

A choropleth map colors world countries by income group using an ordinal color scale with a spectral scheme. The visualization renders geographic boundaries via TopoJSON data and the d3.geoPath projection, with a legend displaying color categories. Interactive zooming is enabled through d3.zoom, and hovering highlights individual countries. Data comes from the world-atlas and visionscarto-world-atlas packages.

Jjrodg
95% match
Loading thumbnail…

Choropleth Map

This choropleth map colors countries by income group using an ordinal color scale with the spectral scheme. It renders geographic boundaries with d3.geoPath and a Natural Earth projection, using TopoJSON data from the world-atlas package. Hovering highlights countries in red, while a legend built with custom D3 code displays the color categories. The map supports zooming and panning through d3.zoom, and tooltips show each country’s name and income group.

CClara Hu
95% match