Skip to main content
SimilarExport ZIP
100%

Iris Task 2

✓ Published0🌍 Public
Vveginetiumeshchandra@lbrce.ac.in
Last edited Oct 20, 2025
Created on Oct 20, 2025
Forked from HTML Starter

This interactive scatter plot visualizes the Iris dataset with an animated transition, plotting the first two numeric columns (sepal length and sepal width) while color-coding each point by the categorical species column using a d3.scaleOrdinal. Built with D3 v7, the visualization renders as SVG circles with tooltips that display the exact attribute values on hover, along with horizontal and vertical gridlines generated via d3.axisBottom and d3.axisLeft. The code auto-detects numeric and categorical columns from the CSV source, applies dropout animation on mouseout, and includes a legend for species identification.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Iris

This interactive scatterplot visualizes the classic Iris dataset, allowing users to compare any two measured features (sepal/petal length and width) via dropdown menus. D3 v7 axes and scales update with animated transitions when a new axis is chosen. Circles are color-coded by iris species, with a legend showing the three classes. The data is loaded from a CSV using `d3.csv`, and the visualization leverages `scaleLinear`, `axisBottom`, `axisLeft`, and `transition` for smooth updates.

ZZeroKurosakii
90% match
Loading thumbnail…

Iris

This interactive scatterplot visualizes the Iris flower dataset, plotting sepal and petal measurements against each other. Users select the x and y axes from dropdown menus, and the points animate smoothly to their new positions with staggered transitions. The visualization encodes the three Iris species with red, green, and blue semi-transparent circles. Built with D3 v7, it uses `scaleLinear`, `axisBottom`, `axisLeft`, and `transition` to handle scaling, axes, and animated updates when the selected columns change.

ZZeroKurosakii
89% match
Loading thumbnail…

Iris Scatter Plot

This interactive scatter plot visualizes the Iris dataset, plotting measurements like sepal and petal length against each other. Users select which features to compare via two dropdown menus, which triggers animated transitions as the circles move to their new positions. The visualization uses d3.csv to load data, d3.scaleLinear and d3.axisBottom/axisLeft to construct axes, and d3.transition for the 1-second animations, rendering points as SVG circles color-coded by iris species.

Xx112358
88% match
Loading thumbnail…

Iris Scatter Plot

An interactive scatter plot visualizes the classic Iris dataset, mapping sepal and petal measurements to the x and y axes. The visualization offers two dropdown menus that let users change which flower attribute is displayed on each axis. The code uses D3 v5 to load the CSV data, create linear scales, and render SVG circles that transition to new positions with a one-second animation. Points are colored by iris species (setosa, versicolor, or virginica), with a legend and axis labels rendered via `d3.axisBottom` and `d3.axisLeft`.

Wwinniepooh520
88% match
Loading thumbnail…

Iris Scatter Plot

This interactive scatter plot displays the Iris dataset, showing measurements of sepal and petal length and width. Users can select which measurement appears on the x-axis and y-axis via dropdown menus. The visualization uses d3.scaleLinear for axis scaling and d3.axisLeft and d3.axisBottom for axes, with circles animated via transition().duration() and delay(). Colors are assigned to species using d3.scaleOrdinal with a manual color range, and a legend is drawn with SVG rectangles and text. Data loads from a CSV URL, and rendering uses SVG with 2-second animated transitions.

Wwaterm80
88% match
Loading thumbnail…

Task9&10

This interactive scatter plot visualizes the Iris dataset, cycling through different x-axis variables (petal width, sepal width, petal length, or sepal length) every few seconds while keeping sepal length on the y-axis. Data points are colored by species using hardcoded marker colors, with a legend and axis labels updated dynamically. Built with D3.js (v6), it uses `scaleLinear`, `axisLeft`, `axisBottom`, and `setInterval` to animate transitions, loading CSV data from a GitHub Gist and rendering as SVG with custom styling.

Mmounikakatipally995@gmail.com
88% match
Loading thumbnail…

iris

This interactive scatter plot visualizes the Iris flower dataset, letting users select which measurements (sepal length/width, petal length/width) map to the x- and y-axes via dropdown menus. It colors each point by species (setosa, versicolor, virginica) using a d3.scaleOrdinal with red, blue, and green, and includes a legend. Built with D3 v5, the visualization renders as SVG with animated transitions that grow circles from a central point over two seconds. It uses d3.csv to load data, d3.scaleLinear for axes, and d3.axisLeft/axisBottom with gridlines.

Iianjwo
88% match
Loading thumbnail…

Iris Scatter Plots V2

This interactive scatter plot displays the Iris flower dataset, letting users explore relationships between sepal and petal measurements across three flower species. Two dropdown menus allow selection of which measurement column maps to the X and Y axes, with the chart updating through animated transitions. The visualization uses D3 v5 (d3.scaleLinear, d3.axisBottom, d3.axisLeft) and SVG rendering, with a legend color-coding each species and data loaded from a CSV file.

SSharon Lin
88% match