Viewing a saved revision (read-only)
2cd9b90df5d349d2bc17da6179f4fad2
Animated Scatter Plot with Menus
An animated scatter plot visualizes the Iris dataset, allowing interactive exploration of relationships between four numeric measurements and species. Users select which column drives the x- and y-axes via dropdown menus, triggering a staggered transition of 150 points as they reposition. The D3.js code uses `selection.join` for efficient enter/update/exit handling, `transition` for smooth animations, and scale functions (`d3.scaleLinear`, `d3.scalePoint`) to map data to coordinates. Hovering highlights a point and shows a tooltip. The SVG plot includes axis labels and uses D3's `axisBottom` and `axisLeft` for ticks.
AI-generated descriptionA reusable scatter plot inspired by Towards Reusable Charts and Observable: selection.join.
Shows the Iris Dataset.