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)

b9904085eba54bc99987e881d3ecfdcb

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.