Skip to main content
100%

Fork of Reusable D3 Scatter Plot

✓ Published0🌍 Public
Sshailajat1998@gmail.com
Last edited Mar 26, 2024
Created on Mar 26, 2024

This example demonstrates a reusable scatter plot that cycles through different dimensions of the Iris dataset, animating every two seconds. It visualizes sepal and petal measurements, with the x-axis switching between petal width, sepal width, petal length, and sepal length, while the y-axis remains fixed on sepal length. Built with D3.js v6, the code uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to map data to SVG circles, and the `scatterPlot` function encapsulates the chart’s configuration. The animation leverages `setInterval` to update the `xValue` accessor and re-render the plot, with data loaded from a remote CSV file via `d3.csv`.

AI-generated description

A reusable scatter plot inspired by Towards Reusable Charts.

Shows the Iris Dataset.

MIT Licensed

Similar vizzes