Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Refactored Bar chart

Public visualization

Refactored Bar chart

0 stars1🌍 Public
Cchrismeeky
Last edited Oct 18, 2021
Created on Oct 18, 2021

This example shows a horizontal bar chart displaying the top 10 most populous countries in 2020, using data loaded from a CSV file via D3’s `csv` utility. The bars render as SVG rectangles, with a yellow circular background and black stroke. React manages the component structure, while D3’s `scaleBand` and `scaleLinear` handle the axis positioning. Custom React components like `AxisBottom`, `AxisLeft`, and `Marks` encapsulate the chart’s parts, and the axes are generated by mapping over tick values from the scales.

AI-generated description

Loads external data using d3's csv utility and renders on a "pathetic" barchart

Comments

Sign in to join the discussion.

MIT Licensed