{"version":"1.0","type":"rich","title":"Axes with React and D3","description":"This example visualizes the top 10 countries by 2020 population as horizontal bars, displaying the data as text labels and bars using React components and D3 scales. The code builds SVG elements from scratch, using `scaleBand` for the y-axis country labels and `scaleLinear` for the x-axis population values, with axis ticks rendered manually. It loads UN population data from a CSV file via `d3.csv` and uses React hooks like `useState` and `useEffect` to fetch and render the data, with the final chart presented as an interactive SVG graphic.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/e21c397a63734626bf80c69f53dde6e6?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}