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)

8d045d69678d496495c2b99de47d3cf9

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