{"version":"1.0","type":"rich","title":"Axis with React & D3","description":"This example shows a horizontal bar chart of the top 10 countries by 2020 population, as loaded from a CSV file. The React component manages the data state, while D3 utilities such as `scaleBand`, `scaleLinear`, and `d3.csv` handle data parsing and scaling. Axes are drawn manually using `.ticks()` and SVG elements, with both grid lines and labels rendered through React’s JSX syntax. The chart uses `max` to determine the domain and maps values from data to pixel coordinates via D3’s scale functions.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/960696c9828b4c0596c8aa9f5450e2b0?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}