Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Reusable D3 Scatter Plot

Public visualization

Reusable D3 Scatter Plot

0 stars0🌍 Public
NNithish Kumar
Last edited Mar 12, 2023
Created on Mar 12, 2023

This example demonstrates a reusable scatter plot of the Iris dataset, cycling through different flower measurements every two seconds to show the relationship between variables. Built with D3 v6, it uses the reusable chart pattern with a closure-based `scatterPlot()` function exposing getter-setter methods for width, height, data, margins, and scales. The plot renders SVG circles with `d3.scaleLinear` for axes and `axisLeft`/`axisBottom` for ticks, updating via `selection.join()`. Data is loaded from a CSV file using `d3.csv`, while the animation is driven by `setInterval`, calling the plot again with a new x-value mapping.

AI-generated description

A reusable scatter plot inspired by Towards Reusable Charts.

Shows the Iris Dataset.

Comments

Sign in to join the discussion.

MIT Licensed