Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Loading Data with React & D3

Public visualization

Loading Data with React & D3

1 star2🌍 Public
MManon ROMAIN
Last edited Oct 13, 2021
Created on Oct 11, 2021
Forked from MouseEvent

This example demonstrates loading and visualizing a CSV dataset of bike availability from a GitHub-hosted file in a React application. It shows a scatterplot of randomly positioned circles, where each circle represents the total number of bikes available for a given hour, with the radius scaled by the summed value. The code uses React hooks (`useState`, `useEffect`) to fetch the data with D3’s `csv` method and `d3.rollups` to aggregate the dataset by date-hour. The circles are rendered as SVG elements, with random opacity and positions, displaying the processed data directly.

AI-generated description

Loading Data with React & D3

Comments

Sign in to join the discussion.

MIT Licensed