Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Reusable D3 Scatter Plot

Public visualization

Viewing a saved revision (read-only)

775e685c25db48d4b214dd3dbcc47c85

Fork of Reusable D3 Scatter Plot

0 stars1🌍 Public
Ggayathrisaxena23@gmail.com
Last edited Mar 30, 2026
Created on Mar 30, 2026

This gallery example demonstrates a reusable scatter plot showing the relationship between study hours and test scores across five data points. The visualization uses d3.scaleLinear to map data domains to pixel coordinates, with axisBottom and axisLeft generating the labeled x- and y-axes. Data points render as black circles via SVG path elements appended through the join pattern. The code separates the chart logic into a scatterPlot.js module, exposing chainable setter methods such as .width and .xValue for configuration. The index.js file initializes the visualization by importing necessary D3 functions and calling the plot on an SVG container with fixed dimensions.

AI-generated description