Mapp

100%

✓ Published1🌍 Public

Last edited Apr 13, 2026

Created on Apr 13, 2026

This choropleth map visualizes world GDP per country using a blue sequential color scale, where darker shades denote higher GDP values. Built with D3 v7, it renders geographic boundaries as SVG paths via `d3.geoPath` and a Natural Earth projection, then maps GDP data from a Plotly-hosted CSV to each country's fill color. Country shapes come from the world-atlas TopoJSON, processed with `topojson-client`. The map includes a title and uses a simple index-based data-to-feature mapping.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Assignment 8 Maps

This choropleth map displays global GDP distribution, coloring countries by their Gross Domestic Product in billions of USD using a sequential green color scale. Built with D3 v7, it loads TopoJSON world atlas data and renders it as SVG paths via `d3.geoPath` with a Natural Earth projection. A threshold-based color scale (`d3.scaleThreshold`) maps GDP ranges to colors, while hover interactions trigger tooltips showing country names and GDP values. A legend explains the color bins, and gray indicates missing data.

445.saiful@gmail.com

82% match

Loading thumbnail…

Maptimedavis Choropleth Map

A choropleth map colors countries by their economy category using a spectral color scale. The map is rendered with d3.geoPath and the d3.geoNaturalEarth1 projection, with a zoom interaction via d3.zoom. A color legend built with d3.scaleOrdinal and d3.schemeSpectral appears at the bottom left. Data comes from the World Atlas TopoJSON and TSV datasets, and hovering highlights a country in red.

MMina Rezaei

81% match

Loading thumbnail…

MAP - CHOROPLETH

This choropleth map displays countries colored by their economy type using a sequential color scale from d3.schemeSpectral, with geographic paths rendered as SVG via d3.geoPath and the Natural Earth projection. Users can click color legend circles to highlight matching countries and dim others, with the legend and map sharing unidirectional data flow through a render function. The map loads world topology from TopoJSON and merges country names from TSV data, while d3.zoom enables pan and zoom interactions on the choropleth.

Ccocktaildata

81% match

Loading thumbnail…

World Map with Population

This example displays a world map choropleth of GDP data, with each country colored according to its economic value. It uses D3 v7 and TopoJSON to load world geography, projecting the map with the `d3.geoNaturalEarth1` projection and rendering countries as SVG paths via `d3.geoPath`. GDP values are fetched from a CSV file, matched to countries through flexible column-name heuristics, and visualized with a color scale. A hover tooltip provides country-specific details, while the map includes a legend for interpreting the color encoding.

PP Manisha

81% match

Loading thumbnail…

link with data

This map visualizes global GDP data by shading each country on a natural Earth projection, with a viridis color scale representing economic output in billion USD. It uses d3.geoPath with topojson to render country boundaries from the world-atlas dataset, and d3.scaleSequential with d3.interpolateViridis for color encoding. Hovering over a country reveals a tooltip displaying the country name and GDP value, while a gradient legend annotates the color-to-value mapping.

AAparna Desi Reddy

81% match

Loading thumbnail…

GDP World Map

This world map visualizes geographic GDP data using a choropleth approach, coloring countries by their economic output. The example loads GeoJSON map data and renders it as SVG paths with `d3.geoPath`, while numeric GDP values drive a color scale. It uses `d3.json` to fetch the dataset and `d3.scaleThreshold` to map values to fill colors, with a tooltip providing details on hover. Built with D3 v6, the visualization demonstrates basic geographic mapping and data-driven styling in an SVG container.

TTom Heffernan

80% match

Loading thumbnail…

A9 - World Choropleth Map

This example shows a world choropleth map of 2021 GDP values by country, with darker blue shading representing higher GDP. A tooltip displays the country name and GDP on mouseover, while a horizontal color legend encodes the scale. The visualization uses a geographic projection via `d3.geoMercator` and `d3.geoPath` to render GeoJSON features, with color mapping through `d3.scaleSequential` and `d3.interpolateBlues`. GDP data is loaded from a CSV using `d3.csv`, and the legend is built with the `d3-legend` library.

DDuc Pham

80% match

Loading thumbnail…

Choropleth Map

This choropleth map visualizes global economic groupings by coloring each country according to its economy category. The visualization uses a natural Earth projection via `d3.geoNaturalEarth1` and `d3.geoPath` to render country boundaries from TopoJSON data loaded from the world-atlas package. A sequential `d3.scaleOrdinal` with `schemeSpectral` assigns colors, while zooming is enabled through `d3.zoom`. Hovering highlights countries in red, and a color legend explains the ordinal categories.

MMabelbao

80% match