Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Cheap Tricks for Interaction

Public visualization

Viewing a saved revision (read-only)

9bec636017704a8aad0d42a2e71e9354

Cheap Tricks for Interaction

0 stars3🌍 Public
CChooo4u
Last edited Sep 26, 2018
Created on Sep 22, 2018

This example shows an interactive world map where clicking anywhere on the SVG injects randomly sized circles onto the canvas, while hovering over individual countries highlights them by changing fill color using CSS. The visualization renders country boundaries from TopoJSON world-atlas data via a natural Earth projection in d3.geoPath, and implements pan-and-zoom controls through d3.zoom. The map itself uses svg elements, with mouse interaction handled through d3.mouse to capture click coordinates, and the underlying country names are loaded from a TSV file.

AI-generated description