Skip to main content
SimilarExport ZIP
100%

Scatter Plot with Colors

✓ Published2🌍 Public
Aafcchilders
Last edited Jan 20, 2022
Created on Jan 19, 2022

A scatter plot of the Iris Dataset with interactive dropdown menus for selecting which flower attributes to plot on the X and Y axes. The visualization uses D3's linear scales for axis mapping, with React rendering the SVG circles and axes. Users can compare sepal and petal measurements across species, with tooltips showing exact values on hover. The chart includes labeled axes and a clean, minimalist design with Poppins typography.

AI-generated description

A scatter plot of The Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot with Color

This interactive scatter plot displays the Iris dataset, with dropdown menus enabling users to select which flower measurements appear on the x- and y-axes. Each point is colored by species using a D3 ordinal scale, and hovering reveals the sepal length via SVG circle titles. Built with React hooks for state management, the visualization uses D3 scales and the `csv` loader to parse data, while custom React components render the axes and marks.

MMario Ibarra
95% match
Loading thumbnail…

Scatterplot with Color

This interactive scatterplot visualizes the Iris Dataset, with dropdown menus allowing users to select which flower measurements appear on the x- and y-axes. Each point represents an individual iris flower, colored by species using a d3.scaleOrdinal with three categorical colors. The React-based interface uses d3.csv for data loading, d3.scaleLinear for axis scales, and SVG circles rendered via React components for the marks. Axis components generate ticks and labels using D3 scale methods, while the axis labels and menus update dynamically based on user selections.

JJun Suzuki
95% match
Loading thumbnail…

Scatter Plot with Color

This interactive scatter plot explores the classic Iris dataset, allowing users to compare any two measured attributes (sepal and petal dimensions) by selecting them from dropdown menus. Each flower is rendered as a circle in SVG, with position mapped by the selected X and Y axes and color encoding species via a D3 `scaleOrdinal` color scale. Built with React and D3 v7, the visualization uses `scaleLinear` for axes and interactive dropdowns to dynamically re-bind the plotted data.

SSerind Joshua McCue
95% match
Loading thumbnail…

Scatter plot with Colors

This interactive scatter plot visualizes the Iris flower dataset, letting users explore relationships between sepal and petal measurements. The visualization uses React dropdown menus to dynamically switch which numerical attributes are plotted on the x and y axes. Each of the 150 flowers is rendered as a colored circle, with species mapped to a categorical color scale (`d3.scaleOrdinal`) using orange, teal, and purple. The chart is built with React and D3 v6, using SVG circles for marks and custom axis components that employ `d3.scaleLinear` for positioning.

Kkragovic
94% match
Loading thumbnail…

Scatter Plot with Colors

This scatter plot displays the Iris dataset, comparing selected attributes such as petal length and sepal width, with each point colored by species. Interactive dropdowns allow users to switch the axes, while hovering over the color legend highlights points of that species and fades the others. Built with React and rendered as SVG, it uses D3's `scaleLinear` for axes and `scaleOrdinal` for the categorical color mapping, fetching the data via `d3.csv`.

Ww.fukuyama@gmail.com
94% match
Loading thumbnail…

Scatter Plot with Color

This interactive scatter plot displays the Iris flower dataset, plotting measurements like petal length and sepal width. Users can select which attributes to display on the X and Y axes via dropdown menus, and hovering over a circle reveals its exact value through a tooltip. The visualization uses React for state management and D3 v7’s `scaleLinear` and `extent` functions to compute axes and scales. Points are rendered as SVG circles, with styled tick marks and axis labels for clarity.

GGonzalo Alarcón Usui
94% match
Loading thumbnail…

Scatter Plot with Color

This interactive scatter plot visualizes the Iris Dataset, allowing users to explore relationships between flower measurements and species. Two dropdown menus let viewers select which attributes appear on the x and y axes, while the three Iris species are distinguished by color. The visualization is built with React and D3 v5, using `scaleLinear` for axes, `scaleOrdinal` for categorical colors, and SVG circles for data points. Button controls update the chart state, re-scaling axes and repositioning marks in response to user selections.

Ee-ines
94% match
Loading thumbnail…

Scatter Plot with Color

This interactive scatter plot visualizes the Iris Dataset, allowing users to explore relationships between sepal and petal measurements through dropdown menus that select which attributes appear on each axis. The visualization uses React with d3.v5 scales, including scaleLinear for positioning and scaleOrdinal to encode species identity with distinct colors. SVG circles render the data points with tooltips showing exact values, while custom AxisBottom and AxisLeft components generate the tick marks and labels. The code employs d3.csv for data loading and d3.format for axis tick formatting.

MMrMartin85
94% match