Reusable D3 Scatter Plot
A reusable scatter plot demonstrates how to build a modular D3 chart with configurable accessor functions. It visualizes the Iris Dataset using a user-defined `xValue` and `yValue`, rendering SVG circles scaled with `d3.scaleLinear` and axes via `d3.axisLeft` and `d3.axisBottom`. Every two seconds, the plot cycles through different columns—petal width, sepal width, petal length, and sepal length—updating the x-axis and circle positions through a set interval that re-calls the chart function. The example uses D3 v6 and follows the "Towards Reusable Charts" pattern, packaging the scatter plot as a closure with setter methods for width, height, data, margins, and radius.
AI-generated descriptionA reusable scatter plot inspired by Towards Reusable Charts.
Shows the Iris Dataset.