{"version":"1.0","type":"rich","title":"Refactored Bar Chart","description":"This example shows a horizontal bar chart ranking the top 10 countries by population for 2020, using SVG rectangles to encode population values along the x-axis and country names along the y-axis. The visualization is built with React for component management and d3.v5 utilities, including `scaleBand`, `scaleLinear`, `csv`, and `max` for data loading and scaling. The data originates from a UN Population 2019 CSV file, fetched via d3's `csv` method and stored in React state with the `useState` and `useEffect` hooks. Custom React components for axes and marks handle the SVG rendering, with the chart embedded in a full-viewport body and production builds of React and D3 loaded via CDN.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/504c93e61af44f44851549acf864e8d3?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}