{"version":"1.0","type":"rich","title":"Axis with React and D3","description":"This example displays the top 10 most populous countries as a horizontal bar chart with axes, using React components to render SVG elements. The `useData` hook loads the UN World Population Prospects 2019 CSV and parses the population column. D3 scales (`scaleBand`, `scaleLinear`) map data to coordinates, while custom `AxisBottom` and `AxisLeft` components generate tick marks and labels. React passes scales and data as props to these components, which use D3’s `ticks()` and domain methods to create the axis visuals.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/a8558998abcf4001a93966bf9776d321?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}