Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

AnimatedScatter Plot with Menus

Public visualization

AnimatedScatter Plot with Menus

0 stars0🌍 Public
Aadventuresenglish.info@gmail.com
Last edited Dec 10, 2023
Created on Dec 8, 2023

This interactive scatter plot visualizes the Iris Dataset, allowing users to switch between measurement axes (sepal/petal length and width) via dropdown menus and toggle the visibility of each species (Setosa, Versicolor, Virginica) with checkboxes. Built with reusable D3.js functions, changes trigger smooth animated transitions of circle positions and axis scales using `transition` with a one-second duration. The code leverages D3’s `scaleLinear`, `scalePoint`, `axisLeft`, and `axisBottom` for rendering, with SVG output and a selection.join pattern for efficient data-driven updates.

AI-generated description

A reusable scatter plot inspired by Towards Reusable Charts and Observable: selection.join.

Shows the Iris Dataset.

Comments

Sign in to join the discussion.

MIT Licensed