Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Learn Animated Reusable Scatter plot with Menu

Public visualization

Viewing a saved revision (read-only)

6cb2782bc3c14b15912a8a8979aa1f26

Learn Animated Reusable Scatter plot with Menu

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

This interactive scatter plot visualizes the Iris dataset, allowing users to dynamically select which flower measurements appear on the X and Y axes through dropdown menus. Built with React and D3 v6, the reusable `scatterPlot` component renders circles in SVG using `d3.scaleLinear` and `d3.extent`, with animated transitions updating positions via `d3.transition()`. The `menu` component leverages D3's `dispatch` pattern to handle axis changes, while axes redraw with `d3.axisLeft` and `d3.axisBottom`.

AI-generated description

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

See also React Starter.