Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Cheap tricks for interaction: reduce instead of forEach

Public visualization

Viewing a saved revision (read-only)

512ab6150c7942fd8e6de5b34d28abd5

Cheap tricks for interaction: reduce instead of forEach

0 stars0🌍 Public
CChristine Lanser
Last edited Oct 7, 2020
Created on Oct 6, 2020

This example displays an interactive world map using D3.js with a Natural Earth projection. The visualization renders country boundaries as SVG paths, with hover effects that change country fill colors from light green to red. It uses d3.json and d3.tsv to load TopoJSON world map data and country names, with a lookup table created via JavaScript's reduce method to associate country IDs with names. The map supports zooming through d3.zoom, and each country includes a title element for tooltip display.

AI-generated description

Hover over and title elements for map