Points on a Map
A world map displays the locations of cities with populations over 50,000 as small semi-transparent dots, overlaid on landmasses with country borders and graticules. Using React, the visualization loads GeoJSON world-atlas topology and city data via D3’s `json` and `csv` methods, then projects coordinates with `geoNaturalEarth1` and renders SVG paths and circles through `geoPath`. The map’s gray land, interiors, and sphere are styled distinctly, while city points use D3’s `projection` to convert longitude and latitude into screen positions.
AI-generated descriptionA world map showing country boundaries and city locations with populations of over 50 000
City data source: https://gist.github.com/curran/13d30e855d48cdd6f22acdf0afe27286
Spatial data source: https://unpkg.com/world-atlas@2.0.2/countries-50m.json