Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Interactive Color Legend

Public visualization

Viewing a saved revision (read-only)

ff69a804781c4f0aa9c5526a6ed35bc6

Interactive Color Legend

0 stars0🌍 Public
Ttharuta
Last edited Aug 7, 2021
Created on Aug 7, 2021

A scatter plot of the Iris dataset displays petal length against sepal width, with points colored by species. An interactive color legend lets viewers hover over species names, which highlights only matching data points while fading all others. Built with React and D3 v5, the visualization uses d3.scaleOrdinal for color mapping, d3.scaleLinear for axes, and SVG circles rendered through React components. Hover state is managed with React's useState hook, triggering opacity transitions on both legend items and the scatter plot marks.

AI-generated description

A scatter plot of The Iris Dataset.