Skip to main content
100%

Reusable D3 Scatter Plot with Symbols

✓ Published0🌍 Public
TTheo-0201
Last edited Sep 24, 2023
Created on Sep 24, 2023

This example shows a reusable D3 scatter plot displaying the Iris dataset, with each species represented by a distinct symbol (circle, diamond, and triangle). The chart maps petal length on the x-axis and sepal length on the y-axis, using axes generated with `d3.axisLeft` and `d3.axisBottom`. The implementation uses `d3.scaleLinear` for positioning, `d3.scaleOrdinal` and `d3.symbol` to assign symbols to species, and a modular JavaScript structure with getter-setter functions to configure width, height, margins, and accessor functions. Data is loaded via `d3.csv` from a GitHub gist URL.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes