Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Learn Dynamic Reusable Scatter plot

Public visualization

Viewing a saved revision (read-only)

92f5a0aa620a4618a720f1f48f91bbfe

Learn Dynamic Reusable Scatter plot

0 stars1🌍 Public
Ccoderhh
Last edited Jan 21, 2024
Created on Jan 21, 2024

This example demonstrates a reusable scatter plot that cycles through different Iris flower measurements, updating every two seconds to compare petal width, sepal width, petal length, and sepal length. Built with React and D3 v6, it renders SVG circles and axes using `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft`. The chart’s data comes from a CSV of Iris flowers fetched with `d3.csv`, and the animation uses `setInterval` to reassign the x-value accessor and re-invoke the plot function.

AI-generated description

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

See also React Starter.