Iris Scatter Plot with Colors and Menus

100%

Iris Scatter Plot with Colors and Menus

✓ Published0🌍 Public

Last edited Dec 31, 2022

Created on Dec 31, 2022

This interactive scatter plot visualizes the Iris flower dataset, letting users choose which measurements (sepal length/width, petal length/width) appear on the x- and y-axes via dropdown menus. Each of the three Iris species is distinguished by a unique color (purple, red, or green) with semi-transparent circles. Built with D3 v5, the visualization uses `scaleLinear` for axes, `axisBottom` and `axisLeft` for ticks, and re-renders with animated transitions whenever a menu selection changes.

AI-generated description

This scatter plot shows data about cars, from UCI Machine Learning Repository: Auto MPG Data Set. The user can select which columns map to X and Y using dropdown menus.

MIT Licensed

Similar vizzes

Loading thumbnail…

Iris Scatter Plot with Menus

An interactive scatter plot of the Iris dataset lets users explore relationships between sepal and petal measurements by choosing which variables appear on the x- and y-axes from two dropdown menus. Points are colored by iris species using d3.scaleOrdinal and schemeCategory10, with a corresponding color legend generated by a custom colorLegend module. The visualization is built with D3 v5, rendering SVG circles via a reusable scatterPlot function that updates scales and axes when the menu selections change.

YYunLing

95% match

Loading thumbnail…

Iris Scatter Plot

This interactive scatter plot displays the Iris dataset, revealing the distribution of flower measurements across three species. Users select which measurement appears on each axis via two dropdown menus, instantly re-rendering the plot. The visualization distinguishes species by color and includes a legend. Built with D3 v5, the code uses `select`, `csv`, `scaleLinear`, `scaleOrdinal`, `axisBottom`, `axisLeft`, and `extent` to create the SVG chart, with a custom `dropDownMenu` component for the interactive controls.

Ttoeric

93% match

Loading thumbnail…

Iris Scatter Plot

This example shows an interactive scatter plot of the Iris dataset, with dropdown menus to select which flower measurements appear on the x- and y-axes. Points are colored by species and transition into place with a staggered animation. Built with D3 v5, the visualization uses `scaleLinear`, `axisLeft`, `axisBottom`, and a custom dropdown menu component. A legend and axis selection panel are rendered to the right of the plot.

Yyixinxu2020

93% match

Loading thumbnail…

Scatter plot with menu and colors

This interactive scatter plot visualizes the Iris dataset, showcasing measurements of sepal and petal dimensions. Users can dynamically select which attributes to display on the X and Y axes via dropdown menus. Hovering over the color legend highlights a specific species, fading the remaining data points to emphasize the selected group. Built with React and D3 v5, the visualization renders as an SVG and uses `scaleLinear` for axis scaling and `scaleOrdinal` for categorical coloring.

Ppatasky

93% match

Loading thumbnail…

Iris Scatterplot With Menus

This interactive scatterplot visualizes the Iris dataset, allowing users to explore relationships between sepal and petal measurements. Two dropdown menus let viewers select which attribute to plot on the x-axis and y-axis, with the chart dynamically updating the scales and axis labels. Built with React and D3 v7, the visualization uses `scaleLinear` for axes, `extent` for domain calculation, and SVG rendering for the scatterplot marks. Data is fetched from a GitHub gist using D3's `csv` loader, with axis components defined as reusable React functions.

JJames Rhodes

93% match

Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot visualizes the Iris dataset, allowing the user to select which flower measurements (sepal length, sepal width, petal length, petal width, or species) appear on the x- and y-axes via dropdown menus. The visualization is built with React and D3 v5, using D3’s `scaleLinear` for axis scaling and the `csv` function to load data. SVG circles represent each iris, with axis ticks and labels rendered by custom React components.

Jjuanmy400

93% match

Loading thumbnail…

Iris Scatter Plot

This interactive scatter plot displays the Iris dataset, allowing users to compare sepal and petal measurements through dropdown menus that select the x- and y-axis variables. Each point represents one flower, colored by its species class, with a legend identifying the three categories. Built with D3 v5, the visualization uses `d3.scaleLinear` for axes, `d3.axisBottom` and `d3.axisLeft` for gridlines, and updates circles and labels dynamically via a render function. SVG rendering handles all graphical elements, while the dropdowns are created through a custom function that binds options to data.

TThe-World-Muda

92% match

Loading thumbnail…

Scatter Plot With Menu

This interactive scatter plot visualizes the Iris Dataset, a classic multivariate flower dataset from a gist by Curran. Users can dynamically select which sepal or petal measurements appear on the X and Y axes using dropdown menus, and the plot updates accordingly. The visualization encodes species through color, with a color legend that supports hover interactions to fade non-matching points. Built with React and D3 v5, it renders axes, circles, and legend items as SVG elements, using scaleLinear, scaleOrdinal, and extent for scaling the data.

AAliaksandr

92% match