🌍 Public
Viewing a saved revision (read-only)
f00f502c87fd4fa39d892750f8376db1
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.