Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Reusable D3 Scatter Plot

Public visualization

Viewing a saved revision (read-only)

94e61143687b40cbb5f70426711d2659

Reusable D3 Scatter Plot

0 stars1🌍 Public
Jjmetzg11alpine
Last edited May 7, 2023
Created on May 7, 2023
Forked from D3 Scatter Plot

This example presents a reusable D3.js scatter plot visualizing the Iris Dataset, with petal length mapped to the x-axis and sepal length to the y-axis. The implementation uses D3's `scaleLinear` for coordinate scaling, `extent` for domain calculation, and `axisLeft`/`axisBottom` for labeled axes. The code demonstrates a custom `scatterPlot` function that accepts configurable parameters like dimensions, margins, data, and value accessors, enabling flexible reuse across different datasets. The plot renders as an SVG with circles sized by a configurable radius parameter, and the dataset is loaded via D3's `csv` function from a remote source.

AI-generated description

A vanilla HTML implementation of a D3 scatter plot. Shows the Iris Dataset.