Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Cheap Tricks for Map Interaction

Public visualization

Viewing a saved revision (read-only)

8ebc1147d9f141d7a86a898b3e343251

Cheap Tricks for Map Interaction

0 stars1🌍 Public
Eegrebing
Last edited Oct 8, 2020
Created on Sep 28, 2020

This example demonstrates map interaction with a zoomable world map that highlights countries on hover. Using D3 v6 and TopoJSON, it renders a natural Earth projection with green country polygons against a blue sphere. The visualization applies d3.zoom for pan and zoom transformations, while CSS hover states change country fills to red. Country names are loaded from a tab-separated values file via Promise.all with the TopoJSON data from the world-atlas package.

AI-generated description