Skip to main content
SimilarExport ZIP
100%

Iris_HW1

✓ Published0🌍 Public
JJoshuoYang
Last edited Sep 26, 2022
Created on Sep 26, 2022

This interactive scatter plot of the Iris Dataset allows users to choose which flower attributes appear on the x- and y-axes via dropdown menus. The visualization renders circles for each iris sample using SVG, with axes and ticks generated by custom components that leverage `d3.scaleLinear` and `d3.extent`. The code uses `d3.csv` to load data from a remote URL and defines tick marks with `AxisBottom` and `AxisLeft` components. The chart's marks include tooltips, and the UI is built with React and `react-dropdown`.

AI-generated description

A scatter plot of The Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

HW1 Scatter Plot

This interactive scatter plot visualizes the Iris flower dataset, letting users explore relationships between four numeric attributes by selecting which ones appear on the x- and y-axes via React dropdown menus. Each point represents a flower, colored by species according to a d3.scaleOrdinal mapping. The visualization uses React components to render SVG elements, with d3.scaleLinear for axes and d3.extent for domains. The code loads data from a CSV file using d3.csv and renders custom axis components with tick marks.

EEast007
90% match
Loading thumbnail…

HW1_Iris

This interactive scatterplot displays the Iris flower dataset, letting users compare four measurements (sepal and petal length and width) by selecting attributes for the x- and y-axes via ReactDropdown. Points are colored by species using d3.scaleOrdinal, with a legend that highlights one class on hover. The visualization uses React and d3.v5, rendering circles as SVG marks with d3.scaleLinear axes. Hovering over legend items filters the plotted circles’ opacity, while built-in tooltips show exact values.

SSandyWu7179290504
90% match
Loading thumbnail…

HW01-Iris

This interactive scatterplot explores the classic Iris dataset, displaying the relationships between sepal and petal measurements. Users can select any combination of the four attributes for the X and Y axes using radio buttons, and the visualization updates accordingly. The three Iris species are distinguished by color: purple, magenta, and indigo, with a legend shown above the chart. Built with React and D3.js (d3.scaleLinear, d3.axisBottom, d3.axisLeft), the SVG plot is rendered dynamically and responds to window resizing. Data is loaded asynchronously from a CSV file via d3.csv.

YYang Shun Yu
90% match
Loading thumbnail…

Iris

This example visualizes the classic Iris dataset as a scatter plot, with dropdown menus that allow the user to select which of the four flower measurements appears on the x-axis and y-axis. Clicking the confirmation button updates the chart, recalculating the linear scales and redrawing the circles. The SVG rendering is built with React and D3 v5, using `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` for axes. Points are colored by species (red, green, blue) and the chart includes labeled axes and gridlines.

ZZhou180
90% match
Loading thumbnail…

HW1_test

This interactive scatter plot visualizes the classic Iris dataset, displaying measurements of sepal and petal dimensions for three flower species. Users can explore relationships between any two numerical attributes using dropdown menus to select variables for the x and y axes. The visualization uses React components with D3 v5 scales and SVG rendering, implementing custom AxisBottom and AxisLeft components along with colored circles to distinguish Iris-setosa, Iris-versicolor, and Iris-virginica specimens.

Ping-Yu Yang
89% match
Loading thumbnail…

HW1 Scatter Plots for Iris

This interactive scatter plot explores the Iris dataset, letting users compare any two of the four flower measurements via dropdown menus. The chart renders 150 species-classified points with a D3 transition that animates them from the center to their positions on the axes, which update smoothly with each selection. Using D3 v7 scales and axes, it draws an SVG with colored circles for each Iris class and includes a legend for identification. The visualization demonstrates the distribution and clustering of the three species across different feature combinations.

TTrista Lee
89% match
Loading thumbnail…

hw1

This interactive scatterplot displays the Iris dataset, with each flower plotted as a semi-transparent circle colored by species. Dropdown menus allow switching which quantitative variable appears on each axis, while a click triggers a staggered animation as the circles transition to their new positions. The visualization is built with D3 v5, using `scaleLinear`, `scaleOrdinal`, `axisBottom`, `axisLeft`, and `transition().duration()`. Animated updates render in SVG.

YYouSheng-Do
89% match
Loading thumbnail…

Iris analysis

This interactive scatter plot explores the Iris dataset, letting users compare measurements by selecting different features for the x- and y-axes via drop-down menus. The visualization uses D3 v5’s `scaleLinear`, `axisBottom`, `axisLeft`, and `scaleOrdinal` to render SVG circles colored by iris species, with a custom legend. A reusable `dropDownMenu` function updates the chart on selection changes, redrawing axes and points with `transition`-free updates.

Wwinniepooh520
88% match