🌍 Public
sleep data
This visualization displays monthly Canadian economic data as a scatterplot, plotting implicit price index values over time from 1961 onward. Each circle represents a data point, with values derived from Statistics Canada’s CSV file, parsed to extract the year and numeric value. The React app uses D3’s `scaleLinear` and `extent` to map axes, while `csv` loads the dataset. Axes are rendered using `axisLeft` and `axisBottom` within a decoupled React-D3 architecture, where a wrapper component handles SVG rendering and the main `viz` function handles circles and scales.
AI-generated descriptionThis viz is a starter that demonstrates patterns used in real world projects in which complexity is anticipated to scale.
- Decoupled React & D3 integration
- Opening moves for scalable complexity
- Industry standard ES modules and JSX
- Copy-paste into existing projects
Any questions? Ask on Twitter!
Also viewable in:
MIT Licensed








Comments
Sign in to join the discussion.