Skip to main content
SimilarExport ZIP
100%

Untitled

✓ Published0🌍 Public
GGogineni44
Last edited Mar 27, 2023
Created on Mar 27, 2023

This interactive scatterplot displays the Iris dataset, with each point colored by species (setosa, versicolor, or virginica) and sized by petal length. The visualization cycles through four feature pairs on the x-axis every few seconds, while the y-axis remains fixed on sepal length. Built with React and D3 v4, it uses `d3.scaleLinear`, `d3.extent`, `d3.axisLeft`, and `d3.axisBottom` to render axes and SVG circles, with a legend and axis labels added dynamically.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

This interactive scatter plot explores the Iris dataset, displaying measurements of sepal and petal dimensions. Users can change which measurements appear on the x- and y-axes via dropdown menus, with points colored by Iris species. The visualization uses D3 v5 scales and axes within a React framework, rendering circles as SVG elements with a color mapping for the three species classes.

Yyuli19991001
93% match
Loading thumbnail…

Untitled

This interactive scatter plot explores the Iris flower dataset, allowing users to compare any two of the four measured attributes (sepal and petal length and width). Selecting a new attribute from the dropdown menus redraws the plot, with points colored by species. The visualization uses D3.js v4 to create an SVG chart with a ggplot2-style gray background and gridlines. It employs `d3.scaleOrdinal` for the color scale and `d3.axisBottom` and `d3.axisLeft` for the axes, re-rendering the graph on each selection change.

Aastolidozo
93% match
Loading thumbnail…

Untitled

This interactive scatter plot displays the Iris flower dataset, allowing users to explore relationships between sepal and petal measurements. Two dropdown menus let viewers select which attribute appears on the x- and y-axes, updating the plot and axis labels accordingly. Data points are colored by species using a categorical scale. The visualization is built with React and D3 v5, using `d3.csv` to load data, `d3.scaleLinear` for axes, and SVG circles for marks. Axes and tick marks are drawn with custom React components.

HHsu0208
93% match
Loading thumbnail…

Untitled

An interactive scatter plot explores the classic Iris dataset by Fisher, visualizing measurements of sepal and petal dimensions across three flower species. Dropdown menus allow the user to select which attributes appear on the x and y axes, while a color legend distinguishes species and fades non-hovered points. Built with React and D3 v5, the visualization uses `d3.scaleLinear` for axes, `d3.scaleOrdinal` for categorical colors, and renders marks as SVG circles with tooltips.

TThe-World-Muda
92% match
Loading thumbnail…

Untitled

A scatter plot visualizes the Iris dataset, encoding sepal and petal measurements as points colored by species. The chart uses D3 v3 scales and axes to map numeric values to pixel positions, with an SVG rendering of circles and a color legend. The React-based application loads the data via the `csv` function from D3, and interactive tooltips display the iris variety and coordinates on mouseover.

Cctarmey
92% match
Loading thumbnail…

Untitled

This scatter plot visualizes the Iris dataset, encoding petal length and petal width as x and y coordinates, while coloring each point by species. The code also reads sepal length and width values into the `rx` and `ry` attributes of each circle, though these do not affect the visual rendering since `r` is set to a fixed radius. Built with React and D3 v6, it uses `d3.csv` for data loading, `d3.scaleLinear` for scales, and `d3.axisLeft`/`d3.axisBottom` for axes with custom labels.

SSrilekha24
92% match
Loading thumbnail…

Reusable_D3_Scatter_Plot.

This interactive scatter plot visualizes the Iris dataset, cycling through different feature pairs (petal width, sepal width, petal length, sepal length) on the x-axis while keeping sepal length on the y-axis. Circles are color-coded by species (red for setosa, violet for versicolor, orange for virginica) with a static legend. Built with React and D3 v6, it uses `d3.csv` for data loading, `scaleLinear` for scales, and `axisLeft`/`axisBottom` for axes. The plot updates every few seconds via `setInterval`, re-rendering the SVG with animated transitions between variable combinations.

Aachyutanandmishra17@gmail.com
92% match
Loading thumbnail…

Untitled

This interactive scatter plot visualizes the Iris flower dataset, displaying measurements of sepal and petal dimensions for three species. Users can switch the x- and y-axis variables via dropdown menus, which triggers a re-render of the visualization. The plot uses D3 v5 with `scaleLinear`, `scaleOrdinal`, and `axisBottom`/`axisLeft` to position circles, color-coded by species. Points animate into place using `transition().duration()` with staggered delays, and a legend notes each species' color.

Aannie520143
92% match