Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

96% Zeiterpannis

Public visualization

Viewing a saved revision (read-only)

88e411c884ba4eaea172ba46fdc73cca

96% Zeiterpannis

0 stars0🌍 Public
Uudjeffrey.jay@gmail.com
Last edited Jan 29, 2026
Created on Jan 29, 2026

A D3.js and React visualization renders five circles loaded from a CSV file, scaling their positions to fit the viewport with `d3.scaleLinear`. Clicking a circle turns it red with a thicker border while others remain cyan. The code uses React hooks for state management and D3’s data join for interactive updates.

AI-generated description

React D3 Circle Visualization

An interactive data visualization built with React and D3.js that displays circles from a CSV file.

Features

  • Interactive Circles: Click circles to select them (they turn red with a border)
  • Responsive Layout: Automatically adjusts to container size
  • CSV Data Loading: Loads circle positions from data.csv
  • Smooth Scaling: Circle positions scale to fit the viewport

Project Structure