Skip to main content
SimilarExport ZIP
100%

scatterplot with color legend

✓ Published1🌍 Public
BBlake McCarty
Last edited May 14, 2022
Created on May 14, 2022

This interactive scatterplot visualizes the Iris flower dataset, allowing users to explore relationships between sepal and petal measurements. Points are colored by species via a categorical ordinal color scale, with a legend identifying the three Iris species. The chart, built with React and D3.js v7, uses SVG rendering and includes dropdowns to switch which numerical attributes appear on the x and y axes, with axes and ticks generated by custom `AxisBottom` and `AxisLeft` components.

AI-generated description

Half of the smiley HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatterplot with Color Legend

This interactive scatterplot visualizes the Iris flower dataset, letting users explore relationships between sepal and petal measurements via dropdown menus that select the x and y axes. The chart displays points colored by species through a D3 scaleOrdinal color legend. Built with React and D3 v5, it renders as SVG using d3.scaleLinear for axes, d3.extent for domains, and custom React components for axes, marks, and the color legend.

MMark Lam
97% match
Loading thumbnail…

Scatter Plot with Color Legend

This interactive scatter plot visualizes the Iris flower dataset, letting users explore relationships between four measurements (sepal and petal length/width) through dropdown menus that control the x and y axes. Points are colored by species using a d3.scaleOrdinal with a corresponding legend showing the three Iris varieties. The visualization is built with React and D3 v6, rendering SVG circles and axes through custom components like AxisBottom, AxisLeft, and Marks, with data loaded via d3.csv from a remote gist.

CCodeDuckie99
96% match
Loading thumbnail…

Scatterplot with Color Legend

This interactive scatterplot displays the Iris Dataset, allowing users to explore relationships between sepal and petal measurements through dropdown menus that control the x and y axes. Each point represents an iris flower, colored by species with a corresponding legend. The visualization uses React components and D3 v7 scales (d3.scaleLinear, d3.scaleOrdinal) to render SVG marks and axes from CSV data.

JJun Suzuki
96% match
Loading thumbnail…

Scatterplot with Color Legend

This interactive scatterplot visualizes the Iris dataset, showing petal length against sepal width with points colored by species. A categorical color legend identifies the three species. Built with React and D3 v7, it uses `scaleLinear` for axes, `scaleOrdinal` for colors, and SVG rendering. Axis components generate ticks, while hover tooltips display formatted values via the `title` element.

KK3zter
96% match
Loading thumbnail…

Scatter Plot with Color Legend

This interactive scatter plot visualizes the Iris dataset, allowing users to compare sepal and petal measurements across three flower species through dropdown menus for the x and y axes. Each point is colored by species using a d3.scaleOrdinal color scale with an accompanying legend. Built with React and D3 v6, the visualization renders as an SVG and uses d3.scaleLinear for axes, d3.extent for domain calculation, and d3.csv for data loading.

LLaura Johnson
96% match
Loading thumbnail…

Scatterplot with Color Legend

This interactive scatterplot visualizes the Iris dataset, allowing users to explore relationships between sepal and petal measurements across three flower species. Two dropdown menus let viewers select which numerical attribute appears on each axis, while the color legend identifies species using d3.scaleOrdinal. The visualization is built with React components, using d3.scaleLinear for both axes, d3.extent for domain calculation, and d3.csv for data loading. The SVG rendering includes separate AxisBottom, AxisLeft, ColorLegend, and Marks components, with native browser tooltips on each circle showing formatted values.

Aalexandermodell
96% match
Loading thumbnail…

Scatterplot with Color Legend

This interactive scatterplot visualizes the Iris dataset, allowing users to explore relationships between sepal and petal measurements across three flower species. Users can dynamically select which attributes to plot on the X and Y axes via dropdown menus, while a color legend distinguishes species using a categorical d3 scaleOrdinal palette. The visualization is rendered as an SVG using React components, with d3 scaleLinear handling axis scaling and the d3 csv loader fetching the dataset. Marks are drawn as circles with tooltips showing the x-axis value.

CChris Knight
96% match
Loading thumbnail…

Scatter Plot with Color Legend

This interactive scatter plot visualizes the Iris dataset, allowing users to explore relationships between sepal and petal measurements across three flower species. Dropdown menus let viewers switch the X and Y axes among four numeric attributes, while a color legend distinguishes species using d3.scaleOrdinal with three categorical colors. The visualization renders as SVG using React components, with d3.scaleLinear handling axis scales and d3.extent computing domains. Marks are drawn as colored circles with tooltips showing values. The data loads asynchronously via d3.csv from a GitHub gist.

MMichael Bruno
96% match