Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Scatter Plot with React & D3

Public visualization

Post on XLinkedIn

Viewing a saved revision (read-only)

2236e097634f41c88dbfdd4f8f440932

Open

Scatter Plot with React & D3

0 stars0🌍 Public
BBismark Kofi Owusu Sarfo
Last edited Sep 17, 2025
Created on Sep 17, 2025

This interactive visualization displays the Iris flower dataset, plotting sepal length over the dataset's row order. Users toggle between scatter plot and line chart views via React buttons, with species color-coded using d3.scaleOrdinal and a d3.schemeCategory10 legend. The D3 code builds linear scales, axes, and renders circles or a path using d3.line, while React manages state and the SVG element lifecycle.

AI-generated description

React D3 Line Chart Example

This project demonstrates how to create a line chart with React and D3 using the iris dataset with a time component added.