π Public
15.00 Refactor Bar Chart
This example refactors a horizontal bar chart that displays the ten most populous countries in 2020 based on UN population data, with country names on the y-axis and population on the x-axis. Built with React and D3 v6, it separates axes and marks into reusable components. The code uses d3.scaleBand and d3.scaleLinear to map data to SVG coordinates, while the AxisBottom, AxisLeft, and Marks components render gridlines, tick labels, and rectangle bars. The data is loaded asynchronously via d3.csv and parsed using a row accessor.
AI-generated descriptionMIT Licensed
Comments
Sign in to join the discussion.