Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Map Interaction with D3.js

Public visualization

Map Interaction with D3.js

0 stars1🌍 Public
Ssiddharth171
Last edited Jul 26, 2020
Created on Jul 26, 2020
Forked from Map with D3.js

This example shows an interactive map of world countries that users can pan and zoom, with countries highlighted in red when hovered over. It renders a Natural Earth projection using D3’s `geoNaturalEarth1` and `geoPath` within an SVG. The map loads world geometry from TopoJSON via `world-atlas` and country names from a TSV file, merging them by ISO code. Zooming is handled with `d3.zoom` and `event.transform` on the entire map group, while each country’s `title` tooltip displays its name.

AI-generated description

A bare minimum HTML page.

See also React Starter.

Comments

Sign in to join the discussion.

MIT Licensed