Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Make a Map

Public visualization

Viewing a saved revision (read-only)

dea76d2c4dbe4901b4b5cb77ec7d354f

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.