Assignment 8 Maps

100%

Assignment 8 Maps

✓ Published3🌍 Public

Last edited Apr 13, 2026

Created on Apr 12, 2026

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.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Map

This choropleth map colors countries by GDP per capita using a green sequential scale, with twelve nations assigned numeric scores from 0 to 100. It displays a Mercator projection of world geography loaded from world-atlas TopoJSON, rendered as SVG paths via `d3.geoPath`. The code uses `d3.scaleSequential` with `d3.interpolateGreens`, joins GeoJSON features with `topojson.feature`, and appends tooltips plus a legend showing the color range from low to high values.

CChindamrohan321@gmail.com

83% 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

83% 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

82% match

Loading thumbnail…

Assignment - 8

A world map visualization displays countries as green or blue polygons with white borders, using data from the world-atlas TopoJSON dataset. The map uses a Natural Earth projection. The D3 code creates an SVG container, applies `d3.geoNaturalEarth1` for projection, and generates geographic paths with `d3.geoPath`. TopoJSON is converted to GeoJSON via `topojson.feature`. Countries receive randomized colors to visually distinguish landmasses.

AAriful Hasan

82% 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

82% match

Loading thumbnail…

Mapp

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.

Aaddalalikitha15@gmail.com

82% match

Loading thumbnail…

choropleth map

This choropleth map shows global economies colored with a sequential green scale, with a hover effect that highlights individual countries and a legend displaying the ordinal color categories. The visualization uses d3.geoPath with a natural Earth projection to render country boundaries from TopoJSON data provided by the world-atlas package, while loadAndProcessData merges TSV metadata with the geometry. Interactions include d3.zoom for panning and zooming the map, and colorLegend renders the categorical legend as an SVG group with circles and text labels.

AAndrew Fletcher

82% match

Loading thumbnail…

Choropleth Map

This choropleth map visualizes global economic classifications by coloring each country according to its income group. Built with D3 v5 and TopoJSON, it uses an ordinal color scale with the spectral scheme and renders geographic shapes via `d3.geoPath` with a natural Earth projection. The map supports pan and zoom through D3’s zoom behavior, and hovering highlights countries in red. A custom legend, generated with appended SVG circles and text, displays the color categories, while data is loaded from the World Atlas TopoJSON and TSV files.

Eevapavlinek

82% match