Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Animated Reusable D3 Scatter Plot

Public visualization

Viewing a saved revision (read-only)

029653c01ec04a3a8e17376ea71892da

Animated Reusable D3 Scatter Plot

0 stars0🌍 Public
MMatheesha Yapa
Last edited Jul 2, 2023
Created on Jul 2, 2023

This example shows a scatter plot using the Iris dataset, with points colored by species. An animation cycles through four flower measurements—petal width, sepal width, petal length, and sepal length—every two seconds. The chart uses a reusable D3 function `scatterPlot` that leverages `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.symbol`, and `d3.axisBottom`/`d3.axisLeft` to render symbols and axes. Rendering uses SVG paths with transitions between data configurations.

AI-generated description

A demonstration of how to start using D3 version 6.