{"version":"1.0","type":"rich","title":"Axis Using React and D3","description":"This example displays a horizontal bar chart of the top ten countries by 2020 population, with custom axes rendered in React. It uses React hooks (useState, useEffect) to fetch CSV data with d3.csv, then maps it with `scaleBand` and `scaleLinear`. Axes are manually constructed from `xScale.ticks()` and the y-domain, drawing SVG lines and text labels. The visualization renders as SVG within a React component, combining d3’s scales and data parsing with React’s declarative UI.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/d18f9f5bcc6642478bf65f0b4b5c028f?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}