{"version":"1.0","type":"rich","title":"The Margin Convention","description":"This example displays a horizontal bar chart of the top 10 countries by projected 2020 population, encoded as SVG rectangles. The chart uses D3's `scaleBand` and `scaleLinear` to map categorical country names and numerical population values to pixel coordinates. It loads data from a CSV file via `d3.csv` and renders the visualization with React, applying a margin convention to position the plot area within the SVG canvas. The bars are drawn using the `rect` SVG element, with dimensions derived from the scales.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/5056974cba4b46c9838e2af46487d37f?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}