🌍 Public
Viewing a saved revision (read-only)
4ef6fe92f4954824ba29b3977c7dcdd1
lines with D3 and React
This example displays a scatterplot of colored circles grouped into five labeled clusters (A–E), connected by colored lines. Clicking a line selects its group, and pressing the left or right arrow keys shifts every point in that group horizontally by 10 units, demonstrating a stateful React interaction driven by keyboard input. The visualization uses React 19 with a `useState`-managed data array, redrawn via `d3.select` and custom `viz.js` logic that builds SVG paths, circles, and axes, while `d3.scaleLinear` maps the 0–1000 x and 0–500 y coordinates.
AI-generated description