{"version":"1.0","type":"rich","title":"Axes with React & D3","description":"This example shows a horizontal bar chart of the top 10 most populous countries in 2020, rendered with React and D3. It loads CSV data from a GitHub gist using D3’s `csv` function, then uses `scaleBand` and `scaleLinear` to map country names and population values to pixel positions. React renders SVG elements, including manually drawn axes with `xScale.ticks()`, grid lines, and text labels, while D3’s `max` computes the domain. The chart updates from a loading state to display the final visualization.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/58636f691f894e20a348711cd4c39835?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}