Skip to main content
SimilarExport ZIP
100%

World Map

✓ Published0🌍 Public
HHemanthh81
Last edited Jul 21, 2023
Created on Jul 21, 2023
Forked from Assignment2_Ques6

This example presents a choropleth world map visualizing countries colored by income group, with data sourced from World Atlas TopoJSON and TSV files. It uses D3 v5 with a geoNaturalEarth1 projection and d3.geoPath to render countries, while a color legend explains the ordinal color scale. The map supports zooming via d3.zoom, and hovering highlights countries in green. Animated transitions update the legend circles when the scale changes.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth map

This example displays a choropleth map of the world, coloring each country according to its income group using a categorical color scale. The visualization loads geographic data from the World Atlas TopoJSON and TSV files, projecting it with `d3.geoNaturalEarth1` and rendering paths via `d3.geoPath`. A custom legend component uses D3 selections to show color categories. The map supports zoom and pan through `d3.zoom`, and hovering over a country highlights it in red while a tooltip reveals its name and income group.

Rroncando
90% 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
89% match
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
89% match
Loading thumbnail…

Choropleth Map

This choropleth map colors world countries by income group using an ordinal color scale with a spectral scheme. The visualization supports pan and zoom interactions through d3.zoom, while d3.geoPath and a Natural Earth projection render the geographic shapes. A custom color legend component displays the categorical colors with labeled circles. Country names and income groups appear as tooltips via SVG title elements, with data loaded from the world-atlas TopoJSON and TSV files.

Aanouckstbr@gmail.com
89% 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
89% match
Loading thumbnail…

Choropleth Map

This example displays a world map as a choropleth, with each country colored by its income group using an ordinal color scale and a custom SVG legend. D3’s `geoNaturalEarth1` projection and `geoPath` render geographic boundaries from a TopoJSON source, while data from a TSV file is joined by country ID. Hovering a country turns it red and shows its name and income group in a tooltip, and pan/zoom interaction is enabled via a custom zoom event.

Ccpsshan
89% 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
89% 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
88% match