{"version":"1.0","type":"rich","title":"Margin Bar Chart","description":"A margin bar chart displays the top 10 countries by 2020 population, with horizontal bars ranking the data from the UN Population dataset loaded via `d3.csv`. The React component uses `useState` and `useEffect` to fetch and parse the CSV, then renders an SVG with `d3.scaleBand` for the categorical country axis and `d3.scaleLinear` for the numerical population axis. Fixed margins position the plot area within a 960x500 viewport, and each bar is drawn as an SVG `rect` whose width is scaled by the population value. The chart updates after the data loads, showing a simple loading state beforehand.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/941e9504bebb45489a08762af2934279?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}