HW1_311553050_Run

100%

HW1_311553050_Run

✓ Published1🌍 Public

Last edited Sep 20, 2023

Created on Sep 19, 2023

Forked from Iris Scatter Plot with Menus

This interactive scatter plot visualizes the Iris dataset, allowing users to compare any two of the four flower measurements via dropdown menus for the x- and y-axes. The visualization is built with d3.v5, using SVG rendering and a custom scatterPlot module that employs d3.scaleLinear, d3.axisBottom, and d3.axisLeft. Data points are colored by species using d3.scaleOrdinal with a schemeCategory10 palette, and a semi-transparent color legend is rendered alongside the plot. The chart updates dynamically when the user selects different measurement columns.

AI-generated description

MIT Licensed

Similar vizzes

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

92% match

Loading thumbnail…

HW2_311553050_RUN

This interactive parallel coordinate plot visualizes the Iris dataset, showing four measured attributes for three flower species. Users can reassign each of the four axes to different columns using dropdown menus, allowing exploration of relationships between variables. The visualization uses D3.js v5 with SVG rendering, employing `d3.scalePoint`, `d3.scaleLinear`, and `d3.line` to draw colored polylines for each sample. A legend identifies the species, and class-specific colors distinguish the three Iris varieties throughout the plot.

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.

陳陳泰元

89% match

Loading thumbnail…

original version of hw1_scatter_plot

This interactive scatter plot visualizes the Iris flower dataset, displaying measurements such as sepal and petal length and width. Users can select which attributes to plot on the x and y axes via dropdown menus. Each of the three Iris species is represented by a distinct colored circle, with a legend on the right identifying the categories. Built with D3.js v5, the visualization uses `d3.scaleLinear` for axes and `d3.axisBottom` and `d3.axisLeft` to render ticks, loading data from an external CSV file.

Cchingching17

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 : 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

89% match

Loading thumbnail…

Iris Scatter Plot 0516017

This interactive scatter plot visualizes the Iris dataset, letting users explore relationships between four numeric flower measurements. The visualization uses D3 v5 with SVG rendering, mapping flower species to semi-transparent red, green, and blue circles. Dropdown menus built with D3 selection methods allow users to dynamically switch which measurement appears on each axis, triggering a full re-render of the chart through the `render` function. The chart includes labeled axes, a title, and a manual legend for the three Iris species categories.

Xx112358

88% match

Loading thumbnail…

HW1_Scatter Plot

This interactive scatter plot explores the classic Iris dataset, displaying measurements such as petal length and sepal width as colored circles representing species. Users can switch the X and Y axes via dropdown menus to compare any pair of attributes, while hovering over the color legend highlights points from a selected species and fades the rest. The visualization is built with React and D3 v5, rendering SVG marks and axes using components like `AxisBottom`, `AxisLeft`, and `Marks`, with scales from `d3.scaleLinear` and `d3.scaleOrdinal`. Data is loaded asynchronously via D3’s `csv` function.

JJames Huang

88% match