{"version":"1.0","type":"rich","title":"The Margin Convention","description":"This example shows a horizontal bar chart of the top ten most populous countries, using data from the United Nations World Population Data 2019. The chart is rendered as an SVG in a React component, with the bars sorted in descending order of population. The code builds the visualization using d3.scaleBand for the y-axis categories, d3.scaleLinear for the x-axis values, and d3.csv to load the data, positioning all elements within a defined margin using a translation transform.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/98daa60f030d4d208fd629a96e7bea32?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}