{"version":"1.0","type":"rich","title":"Dataviz 2020_Ep22 - 15. The Margin Convention (with React and D3) (BarChart Vertical Ver.)","description":"A vertical bar chart displays the ten most populous countries in 2020 from a UN population CSV loaded with `d3.csv`. React renders SVG rectangles, while D3's `scaleBand` and `scaleLinear` map country names and population values to pixel coordinates. The chart applies the margin convention by translating a `<g>` element via `transform`, separating the plotting area from the viewport. Data loading occurs in a `useEffect` hook, and the visualization updates once the asynchronous CSV fetch resolves.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/c2c816121c724549869d2af526092008?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}