Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Cheap Tricks for Interaction

Public visualization

Viewing a saved revision (read-only)

f13b242f6bbc4b7199b1a45cfdebf89f

Cheap Tricks for Interaction

0 stars0🌍 Public
NNikkor
Last edited Oct 3, 2018
Created on Sep 23, 2018

This interactive world map highlights countries by name on hover and changes their fill color when clicked, toggling between red and light green with a one-second transition. Built with D3 v5 and TopoJSON, it loads world-atlas geographic data, renders shapes using `d3.geoPath` with a Natural Earth projection, and includes a pan-and-zoom interaction via `d3.zoom`. Hover styling is defined in CSS, while click behavior is handled by appended SVG paths with `d3.select` and `transition().duration()`.

AI-generated description