{"version":"1.0","type":"rich","title":"The margin convetion","description":"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`.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/c322aee1814f42c7b0cebf0d149adcc4?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}