{"version":"1.0","type":"rich","title":"Axis with React & D3","description":"A horizontal bar chart displays the ten most populous countries for 2020, using UN population data loaded as CSV via d3.csv. The React component manages state with useState and useEffect, while D3’s scaleBand and scaleLinear compute the y- and x-axis positions. SVG elements are generated directly in JSX, with custom tick marks rendered from xScale.ticks() and text labels using the band scale’s domain. Each bar is a rectangle whose width maps population via xScale, and the chart updates after data asynchronously arrives.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/619e1886be1140bdb364640ea4a04228?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}