Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Reusable Scatterplot

Public visualization

Reusable Scatterplot

0 stars1🌍 Public
BBryan Baird
Last edited Jul 2, 2023
Created on Jul 2, 2023

This interactive scatterplot demonstrates a reusable D3 component that visualizes the Iris dataset, cycling through different combinations of sepal and petal measurements every two seconds. The chart animates smoothly as the x-axis, y-axis, and point radius change between variable pairings, using D3's transition API for the morphing effect. The implementation builds a custom `scatterPlot` function that leverages `scaleLinear`, `scaleSqrt`, and `axisBottom`/`axisLeft` to render axes, while the join operation handles circle updates and transitions. The JavaScript code fetches the CSV data from a GitHub gist and binds it to the plot's configurable `xValue`, `yValue`, and `radius` properties, showing how D3’s modular design supports adaptable, data-driven visualizations.

AI-generated description

A demonstration of how to start using D3 version 6.

Comments

Sign in to join the discussion.

MIT Licensed