{"version":"1.0","type":"rich","title":"Fork of Fork of Fork of ICE-6: Rendering Marks and Channels with React & D3","description":"This example shows a horizontal bar chart of the top 10 countries by population in 2019, with country names on the y-axis and population values on the x-axis. The React component uses React hooks to load CSV data via `d3.csv`, then renders SVG marks as `<rect>` elements for bars and `<text>` for axis labels. It leverages `d3.scaleBand` and `d3.scaleLinear` to map data to coordinates, with gridlines and ticks generated manually from the scales. The chart is built entirely with React components and D3 utilities, without a separate visualization library.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/add519d7784f46698142258f858f1a95?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}