Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Make a Map

Public visualization

Viewing a saved revision (read-only)

76f0ab1c4a484205952fd1787bd0b014

Make a Map

0 stars1🌍 Public
MMatthew Rubino
Last edited Jun 12, 2021
Created on Jun 12, 2021
Forked from Face Time

This example renders an interactive world map using the Natural Earth dataset from world-atlas, displaying country boundaries with hover highlighting. The visualization uses D3’s geoNaturalEarth1 projection and geoPath to draw SVG paths, with topojson’s feature method converting TopoJSON to GeoJSON. Countries are colored green, turning red on mouseover, while the ocean sphere is light blue. The map supports pan and zoom through d3.zoom, which applies a transform to the map’s group element.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.