Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Animated Scatter Plot with Menus

Public visualization

Animated Scatter Plot with Menus

0 stars1🌍 Public
AAndre J Denais
Last edited Jun 24, 2021
Created on Jun 24, 2021

This example visualizes the Iris dataset as an animated scatter plot with interactive dropdown menus for selecting the x and y variables. The plot uses `d3.scaleLinear`, `d3.extent`, `d3.axisLeft`, and `d3.axisBottom` to map data coordinates, while `d3.transition` animates circle positions, radii, and axis updates over 1000 milliseconds. The menus are built with a reusable `menu` component that dispatches `change` events, and the chart itself follows a reusable `scatterPlot` pattern using `selection.join` for enter/update/exit handling. Data is loaded via `d3.csv` from a gist URL, rendered as SVG circles, and includes species labels among the selectable columns.

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