Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Interactive Color Legend

Public visualization

Viewing a saved revision (read-only)

21a36b2c065d40a5b25929e0aa6528d4

Interactive Color Legend

0 stars0🌍 Public
JJoe Hutchins
Last edited Feb 25, 2022
Created on Feb 25, 2022

This interactive scatter plot visualizes the Iris Dataset, displaying petal length against sepal width with points colored by species. A color legend on the right allows hovering over a species name to highlight only its corresponding data points while fading the others to 20% opacity. The visualization is built using React with D3 scales (`d3.scaleLinear`, `d3.scaleOrdinal`) and SVG rendering. Data is fetched via `d3.csv`. The code includes custom components for axes, color legend, and marks, with hover state managed through React hooks.

AI-generated description

A scatter plot of The Iris Dataset with an Interactive Color Legend