Fork of Choropleth Map

100%

Fork of Choropleth Map

✓ Published0🌍 Public

Last edited Jun 1, 2021

Created on Jun 1, 2021

This visualization displays a choropleth map of world countries colored by income group using a categorical color scale. D3 v6 and topojson load geographic data from the World Atlas, while `geoNaturalEarth1` projection and `geoPath` render the SVG paths. A legend built with `scaleOrdinal` and `schemeSpectral` shows income categories. Pan and zoom interactions are enabled via `d3.zoom`, and hovering highlights countries in red.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Choropleth Map

This fork of a choropleth map colors countries by their income group using a spectral color scale. The visualization employs the d3 geoNaturalEarth1 projection and d3.geoPath to render geographic features from world-atlas TopoJSON and TSV data. A custom color legend displays the ordinal scale, while the d3 zoom event enables interactive panning and zooming. Hovering over a country turns it red and reveals its name and income category in a tooltip.

Mmehdi kaidi

93% match

Loading thumbnail…

Fork of Choropleth Map

This choropleth map visualizes global income groups using a natural Earth projection, coloring each country according to its income classification. The map is rendered with SVG paths using `d3.geoPath` and `geoNaturalEarth1`, with country data loaded from TopoJSON and TSV files via the world-atlas package. A custom color legend component displays the ordinal color scale, which uses `scaleOrdinal` with a spectral scheme. The visualization supports pan and zoom through `d3.zoom`, and hover interactions highlight individual countries.

NNYCUBK201

93% match

Loading thumbnail…

Fork of Choropleth Map

This fork of a choropleth map colors world countries by income group using a spectral color scale. The visualization uses D3 v5 and the `geoNaturalEarth1` projection with `geoPath` to render country shapes from the world-atlas TopoJSON and TSV data. A custom `colorLegend` displays the ordinal color scale as circles and text, and zooming is enabled through D3’s `zoom` event. Hovering a country turns it red, and tooltips show its name and additional text.

Ttbar72

93% match

Loading thumbnail…

Fork of Choropleth map with D3.js!

This choropleth map colors countries by income group using a categorical color scale from `scaleOrdinal` and `schemeSpectral`. The visualization loads world geometry from TopoJSON via `world-atlas` and joins it with tab-separated metadata, then renders paths with `geoPath` and a `geoNaturalEarth1` projection. The map supports zooming through `d3.zoom`, highlights countries on hover via CSS, and includes a custom color legend built with SVG circles and text.

NNikithakatta30

92% match

Loading thumbnail…

Fork of Choropleth Map

This choropleth map colors countries by income group using an ordinal scale with a spectral color scheme. The visualization supports zooming and panning via d3.zoom, and includes a custom color legend with circles and labels built through reusable D3 selections. Data comes from the world-atlas TopoJSON and TSV files, rendered as SVG paths using d3.geoPath with a natural Earth projection. Hovering highlights countries in red, and tooltips display country names and income categories.

SSaip Can Hasbay

92% match

Loading thumbnail…

Fork of Choropleth Map

This example displays a world choropleth map coloring countries by their economic income group, with a categorical color legend and zoom/pan functionality. The visualization uses D3 v5 APIs including `geoPath` with `geoNaturalEarth1` projection, `scaleOrdinal` with `schemeSpectral` for color mapping, and `zoom` for interaction. It loads geographic data from the world-atlas TopoJSON and TSV files via `topojson.feature`. Countries render as SVG paths with hover highlighting, and the color legend dynamically generates from the ordinal scale domain.

Jjay-goone

91% match

Loading thumbnail…

Choropleth Map

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.

HHe Jianfeng

91% match

Loading thumbnail…

Choropleth Map

This choropleth map shows countries colored by income group, with a clickable color legend that highlights matching regions and a pan-and-zoom interface. It uses D3 v5 with `geoNaturalEarth1` and `geoPath` to project TopoJSON world data loaded from the World Atlas, while `scaleOrdinal` and `schemeSpectral` assign colors. A zoom behavior updates the map transform on interaction. The legend, rendered with SVG circles and text, triggers the selection filtering.

Ggorfoula

91% match