Fork of React & D3 Starter
✓ Published1🌍 Public
This example visualizes a world map highlighting selected countries based on custom data. It loads country boundaries as TopoJSON from the world-atlas package, converts them to GeoJSON using `topojson.feature`, and projects them with `d3.geoMercator` fitted to the viewport. The SVG path elements are drawn with `d3.geoPath`, and each country receives a fill color determined by a lookup table: orange for the USA, India, and China, gray otherwise. The React component integrates with D3 through a ref and the `useEffect` hook, displaying a simple text message from D3 alongside the map.
AI-generated descriptionMIT Licensed