Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Reusable D3 scatter plot

Public visualization

Viewing a saved revision (read-only)

82f5f36e9d4b42d5aff5543d04371b01

Reusable D3 scatter plot

0 stars2🌍 Public
Bbjfmbeck
Last edited Mar 15, 2023
Created on Mar 13, 2023
Forked from scatterplot

This example presents an interactive scatter plot of the classic Iris flower dataset, using SVG circles to visualize relationships between different measurements like petal length and sepal length. Built with React and D3 v3, the visualization cycles through four data columns every two seconds, smoothly animating the transition of points across axes via D3’s `transition.attr` method. The reusable `scatterPlot` function leverages D3 scales (`scaleLinear`), axes (`axisLeft`, `axisBottom`), and data joins to dynamically update the visualization. The code loads data from a remote CSV using `d3.csv` and adapts to the browser viewport dimensions.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.