Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Reusable D3 Scatter Plot with Symbols

Public visualization

Viewing a saved revision (read-only)

adbdbaa34df141d686f6b4abd4e29543

Reusable D3 Scatter Plot with Symbols

0 stars0🌍 Public
TToly
Last edited Dec 30, 2022
Created on Dec 30, 2022

A reusable D3 scatter plot displays the Iris Dataset, mapping petal width against sepal length and encoding species with distinct SVG symbol shapes from `d3.symbol`. The chart uses `d3.scaleLinear` for axes, `d3.scaleOrdinal` to assign symbols, and `d3.axisLeft`/`d3.axisBottom` for ticks. A `scatterPlot` factory function configures dimensions, margins, and accessors via chained methods, then renders paths using `d3.symbolGenerator`. Data is loaded asynchronously with `d3.csv` from a GitHub Gist, and the plot fills the window with a 24px tick font.

AI-generated description

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