🌍 Public
Viewing a saved revision (read-only)
86e08979b5c046e8884496304429ca66
ICE-6: Rendering Marks and Channels (Bar Chart)
This example renders a horizontal bar chart using React and D3 v5, displaying the 2022 population for three countries from a CSV dataset. The visualization uses SVG marks and channels, with `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis. React state manages the asynchronous CSV loading via D3’s `csv` function, while the code manually draws axis ticks, gridlines, and colored rectangles. The chart includes a purple vertical grid and labeled axes, with data filtered to the first three rows of the source CSV.
AI-generated descriptionA bare minimum HTML page.