Scatterplot with Color Legend

100%

Scatterplot with Color Legend

✓ Published1🌍 Public

Last edited Nov 23, 2021

Created on Nov 23, 2021

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.

AI-generated description

A scatter plot of the Iris Dataset.

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 dataset, allowing users to explore relationships between sepal and petal measurements across three flower species. Two dropdown menus let viewers select which attributes appear on the x and y axes, while a color legend distinguishes species using d3.scaleOrdinal. The visualization uses React to manage state and render SVG elements, with D3 scales (d3.scaleLinear, d3.extent) handling coordinate mappings and axes. Data loads asynchronously via d3.csv from a remote source.

Ttharuta

97% match

Loading thumbnail…

Scatter Plot with Color Legend

This interactive scatter plot visualizes the Iris flower dataset, plotting sepal and petal measurements against each other. Users select X and Y axes from dropdown menus, with points colored by species and a color legend identifying the three categories. The visualization uses D3 v5 scales and axes (scaleLinear, AxisBottom, AxisLeft) within a React framework, rendering SVG circles via the Marks component. Data is loaded asynchronously from a CSV file using d3.csv, with ordinal color encoding via d3.scaleOrdinal and react-dropdown handling user selections.

Ccynichole

97% 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

97% 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

97% match

Loading thumbnail…

Scatter Plot Iris with Color Legend

An interactive scatter plot of the Iris dataset with dropdown menus to select the x and y axes shows the relationship between sepal and petal measurements. The visualization uses React for the UI, d3.v7's scaleLinear, scaleOrdinal, and extent for scales, and renders as SVG with color-coded circles representing species. A color legend identifies the three Iris species, while axis labels and dropdown selectors update dynamically as users change the plotted attributes.

EEFezerKW

97% match

Loading thumbnail…

Scatter Plot with Color Legend

This interactive scatter plot visualizes the Iris flower dataset, allowing users to explore relationships between different measurements (sepal length, sepal width, petal length, petal width) by selecting attributes for the x and y axes via React dropdown menus. The visualization uses d3.scaleLinear for axes, d3.scaleOrdinal for color encoding of species, and renders circles as SVG marks. React state management tracks the selected attributes, while d3.csv loads the data and d3.format formats axis tick labels, with a color legend indicating species.

CChristian Potdevin

97% match

Loading thumbnail…

Scatter Plot with Color Legend

This interactive scatter plot visualizes the Iris flower dataset, showing relationships between four measured attributes (sepal and petal length/width). Users can dynamically select which attributes appear on the x- and y-axes via dropdown menus, while a color legend distinguishes the three iris species. The visualization uses React with D3 v5 scales (d3.scaleLinear, d3.scaleOrdinal) for positioning and coloring, renders marks as SVG circles, and reads the data from a CSV using d3.csv.

RRiccardo De Lucia

97% match