Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Choropleth map with interaction

Public visualization

Viewing a saved revision (read-only)

283993c1a4d04c6a992f8930b86c1e8b

Choropleth map with interaction

0 stars0🌍 Public
JJasonYeong0821
Last edited Nov 23, 2020
Created on Nov 23, 2020

This choropleth map displays world economies using a color scale mapped to each country, with dimming and highlighting applied when a legend category is selected. Built with D3 v5, it uses `d3.geoNaturalEarth1` and `d3.geoPath` for projection and rendering, and `d3.zoom` for panning and zooming. A clickable legend, rendered via custom D3 selections, filters the map by economy type, while data is loaded from TopoJSON and TSV files using `d3.json` and `d3.tsv`. The map renders as SVG with hover effects and interactive focus.

AI-generated description

Demonstrates fundamental DOM manipulation using D3.js by making a smiley face whose eyebrows move.