🌍 Public
Dataviz 2020_Ep21 - 14. Bar Chart (with React and D3) (Vertical Ver.)
MMinwoo Pak
Last edited Jul 12, 2021
Created on Jul 11, 2021
This example displays a vertical bar chart of the top ten countries by 2020 population, using the UN Population dataset loaded via D3’s `csv` utility. React manages the component state and renders SVG `rect` elements, while D3’s `scaleBand` and `scaleLinear` compute the bar positions and heights. The chart resizes to the full browser window, and bars extend upward from the bottom edge with the y-axis inverted to match the data scale. D3 v6 and React 17 are loaded from CDNs, and the visualization updates after an asynchronous data fetch.
AI-generated descriptionA program that loads in some data about CSS named colors using D3 utilities, and uses React to render the data.
MIT Licensed
Comments
Sign in to join the discussion.