Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Interactive Color Legend

Public visualization

Viewing a saved revision (read-only)

525ee57d791b4e109115f69b2012b30f

Interactive Color Legend

0 stars0🌍 Public
Ddaneslutzky
Last edited Oct 5, 2021
Created on Oct 5, 2021

This interactive scatterplot visualizes Iris flower measurements, plotting sepal length against sepal width for three species. The React-based interface uses D3.js scales (scaleLinear, scaleOrdinal) to position and color each circle. A custom ColorLegend component responds to mouse hover events, highlighting the selected species by fading all other points to 20% opacity. Hovering a legend item filters the visible marks, while tooltips display exact values. Data loads asynchronously from a CSV file using d3.csv.

AI-generated description

A program that loads data about CSS named colors and uses React to render the data.