HW1

100%

✓ Published1🌍 Public

Last edited Sep 10, 2024

Created on Sep 8, 2024

This interactive scatter plot visualizes the Iris dataset, allowing users to explore relationships between sepal and petal measurements. The visualization uses D3.js (v7) to render circles colored by species (Iris-setosa, Iris-versicolor, and Iris-virginica) on an SVG canvas. Users can dynamically change the X and Y axes via Bootstrap dropdown menus, which trigger a re-render of the scatter plot. The code uses D3's `scaleLinear`, `scaleOrdinal`, `axisBottom`, and `axisLeft` APIs to handle scaling, axes, and color encoding, with CSV data loaded from `iris.csv`.

AI-generated description

MIT Licensed

Similar vizzes

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

94% match

Loading thumbnail…

HW2

An interactive scatter plot of the classic Iris dataset, colored by species, displays measurements of sepal and petal dimensions. Two dropdown menus let users choose which measurement appears on each axis, and the plot updates instantly. The code uses D3 v7’s `scaleLinear`, `axisBottom`, `axisLeft`, and `scaleOrdinal` with `schemeCategory10` to render SVG circles, with data loaded from a local CSV file via `d3.csv`.

Kkezianathania021@gmail.com

93% match

Loading thumbnail…

HW1-iris.csv

This interactive scatterplot visualizes the Iris dataset, displaying sepal and petal measurements for three Iris species. Users can dynamically select which measurement appears on the x-axis and y-axis via dropdown menus, with each update re-rendering the plot. The visualization uses d3.scaleLinear for axes and d3.scaleOrdinal to map species to distinct colors. Rendered as SVG using d3.select, d3.csv loads the data from a GitHub-hosted CSV file, while d3.axisBottom and d3.axisLeft generate the labeled axes with gridlines.

CChristian Magelssen

93% match

Loading thumbnail…

Fork of HW1

An interactive scatter plot visualizes the Iris dataset, displaying measurements of sepal length, sepal width, petal length, and petal width across three iris species. Users select which measurement appears on each axis through Bootstrap dropdown menus. The visualization uses d3.csv to load data, d3.scaleLinear for axes, d3.scaleOrdinal with schemeCategory10 to color points by species, and d3.axisBottom and d3.axisLeft for tick marks, all rendered as SVG elements with a transparent circle effect.

Kkezianathania021@gmail.com

92% match

Loading thumbnail…

109705001_hw1

This interactive scatter plot visualizes the Iris dataset, displaying measurements of sepal and petal dimensions. Users can dynamically select which measurement appears on the x- and y-axes via radio buttons, with points colored by Iris species (setosa, versicolor, virginica) according to an SVG legend. The visualization is built with D3 v7, using `scaleLinear` for axes, `axisBottom` and `axisLeft` for tick marks, and SVG circles for data points.

Yyihsuan

91% match

Loading thumbnail…

hw1_scatter_plot

This scatter plot visualizes the Iris flower dataset, showing the relationship between two selected features (sepal length, sepal width, petal length, or petal width) chosen via dropdown menus. Points are colored by species (Iris-setosa, Iris-versicolor, Iris-virginica) using CSS classes. The visualization is rendered with D3 v5's `scaleLinear`, `axisBottom`, and `axisLeft` APIs, with data loaded from a CSV file and interactive legends displayed on the side.

Cchingching17

91% match

Loading thumbnail…

HW1

This interactive scatter plot visualizes the Iris flower dataset, encoding the three species—setosa, versicolor, and virginica—as distinct colors. Users can dynamically select any two of the four flower measurements for the x- and y-axes using radio buttons, and the chart recalculates its linear scales and redraws the points with updated axis labels. Built with D3.js v4, the visualization uses `d3.csv` to load the data, `d3.scaleLinear` for axis mapping, and `d3.axisBottom` and `d3.axisLeft` to render the axes. The SVG rendering includes light grey grid lines and a custom legend near the top.

Aanna960073@gmail.com

91% match

Loading thumbnail…

HW1 - Scatter Plot of Iris Dataset

An interactive scatter plot visualizes the Iris dataset, allowing users to compare any pair of four floral measurements via two dropdown menus. The plot depicts all 150 specimens as colored circles, with light pink, green, and orange distinguishing the three iris species through a custom color legend. Built with D3 v5, the visualization uses `csv()` to load data, `scaleLinear()` for axes, and `axisBottom()`/`axisLeft()` for grid lines. Animated transitions animate circles from the chart’s center to their plotted positions after each axis selection. SVG rendering displays the chart and dropdown menus.

Ee94091071@gs.ncku.edu.tw

91% match