Skip to main content
SimilarExport ZIP
100%

HW01-Iris

✓ Published0🌍 Public
YYang Shun Yu
Last edited Sep 18, 2023
Created on Sep 14, 2023
Forked from Hello VizHub

This interactive scatterplot of the classic Iris dataset allows viewers to explore relationships between sepal and petal measurements by selecting any pair of features for the x- and y-axes via radio buttons. The plot displays 150 flowers, color-coded by species, with semi-transparent circles rendered as SVG. The visualization dynamically updates using D3.js scales and axes, and it redraws responsively on window resize. Data is loaded from a CSV file, and species-specific colors are applied through CSS classes.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

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
95% match
Loading thumbnail…

Iris analysis

This interactive scatter plot allows users to explore the classic Iris dataset by selecting which sepal or petal measurement appears on the X and Y axes via dropdown menus. Each of the 150 flowers appears as a semi-transparent circle, colored by species (setosa, versicolor, or virginica) with a legend. The visualization uses d3.csv for data loading, d3.scaleLinear for the axes, d3.scaleOrdinal for colors, and d3.select to rebuild the SVG on each menu change.

XXinYaoHuang
90% match
Loading thumbnail…

HW1_311553050

This interactive scatter plot visualizes the Iris dataset, displaying the relationship between two user-selected flower measurements (sepal length, sepal width, petal length, petal width) on the x- and y-axes. Points are color-coded by iris class using `d3.scaleOrdinal` with `d3.schemeCategory10`, and a color legend is rendered as an SVG group. Two dropdown menus allow the viewer to change the axes. The plot uses `d3.axisBottom` and `d3.axisLeft` with grid lines, and updates dynamically via D3's data join pattern.

YYunLing
90% match
Loading thumbnail…

310551076_HW1_Scatter Plots

This interactive scatter plot visualizes the Iris dataset, showing how three flower species cluster across selected measurement pairs. Two dropdown menus allow users to independently choose which of the four features (sepal length, sepal width, petal length, petal width) appear on the x- and y-axes. The code uses D3.js v7 with SVG rendering, employing `scaleLinear`, `axisBottom`, and `axisLeft` to build the axes and gridlines. Circles are colored by species using a hardcoded color map, and the chart updates dynamically through the `render` function.

陳陳泰元
90% match
Loading thumbnail…

hw1

This interactive scatterplot visualizes the Iris dataset, displaying flower measurements selected via radio buttons for both the X and Y axes. Users can switch between sepal length, sepal width, petal length, and petal width to explore relationships among the 150 samples. The code uses D3.js scaleLinear and extent functions to map data coordinates, with axes rendered using axisLeft and axisBottom. Radio button events trigger re-rendering of the SVG visualization, updating the circle positions accordingly.

Yyihsuan
90% match
Loading thumbnail…

310551076_HW1_Scatter Plots (Interactive Legend)

This interactive scatter plot displays the Iris dataset, allowing users to explore relationships between sepal and petal measurements across three flower species. Dropdown menus select which features appear on the x- and y-axes, and hovering over any point highlights all points of the same species while dimming others. The visualization uses D3 v7 with `scaleLinear`, `axisBottom`, and `axisLeft` for scales and axes, and updates the SVG via a `render()` function. CSV data is loaded with `d3.csv`, and species colors are mapped explicitly in the code.

陳陳泰元
90% match
Loading thumbnail…

HW1_Iris

An interactive scatterplot of Fisher's Iris dataset lets users explore relationships between sepal and petal measurements by switching the X and Y axes via dropdown menus. Species are encoded by color, with a legend that filters the displayed points on hover. The visualization is rendered as an SVG using React and D3 v5, employing D3's `scaleLinear` and `scaleOrdinal` scales for axes and color, along with D3's `extent` for domain calculation.

SSandyWu7179290504
90% match
Loading thumbnail…

HW1 : Scatter Plot

This interactive scatter plot visualizes the Iris flower dataset, displaying measurements of sepal and petal length and width for three species. Users select axes from dropdown menus and confirm their choices to update the visualization, which uses colored circles to distinguish Iris-setosa, Iris-versicolor, and Iris-virginica. Built with D3 v5, the code employs d3.scaleLinear, d3.extent, d3.axisBottom, and d3.axisLeft to render axes and SVG circles, with data loaded from a local CSV file.

LLSAWB
90% match