🌍 Public
Viewing a saved revision (read-only)
580c34cdf04c4503b19e0cafd1aa4042
The margin convetion
This example visualizes the top 10 most populous countries in 2020 using horizontal bars. A React app loads CSV data from a GitHub gist, processes it with D3’s `csv` and `max` functions, and maps population values to a linear scale while country names are mapped to a band scale. The SVG rendering uses `rect` elements positioned within a translated group, respecting uniform margins. The chart updates as the browser window resizes, since dimensions derive from `window.innerWidth` and `window.innerHeight`.
AI-generated descriptionA program that follows your mouse with a circle.