🌍 Public
Viewing a saved revision (read-only)
116a971ce1f94d0bb4fe2cccb01370e9
Points on a Map
This example displays world cities as scaled circles on a natural Earth projection, with each circle’s radius proportional to its population. The map renders landmasses, graticules, and interiors using `d3.geoPath` and `d3.geoNaturalEarth1`, while the city points are drawn as SVG circles with a square-root scale for size encoding. The visualization loads geographic topology from `world-atlas` and city CSV data via `d3.csv`, using React hooks (`useState`, `useEffect`) to manage the asynchronous data fetching and triggering re-renders.
AI-generated descriptionA program that loads in some data about CSS named colors using D3 utilities, and uses React state to keep track of the data.