Skip to main content
SimilarExport ZIP
100%

Fork of 310551076_HW1_Scatter Plots (Interactive Legend)

✓ Published0🌍 Public
陳陳泰元
Last edited Nov 22, 2022
Created on Nov 22, 2022

This interactive scatter plot visualizes the Iris dataset, showing the relationships between four flower measurements with points colored by species. Two dropdown menus allow users to select which features appear on the x and y axes. Hovering over a point highlights all points of the same species while fading others, and the interactive legend responds to hover events. The visualization uses d3.v7 with scaleLinear, extent, axisBottom, and axisLeft to render the SVG axes and circles, with animations triggered by menu changes.

AI-generated description
MIT Licensed

Similar vizzes

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.

陳陳泰元
92% 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…

Fork of Scatter Plot 0927

This interactive scatter plot displays the Iris flower dataset, with users selecting which measurements map to the x- and y-axes via dropdown menus. Points are colored by species—purple for setosa, red for versicolor, and green for virginica—with a legend beneath the chart. Built with D3 v5, the visualization uses `scaleLinear`, `axisBottom`, and `axisLeft` for axes, while circles enter with a staggered 2-second transition animation. The data loads from a local CSV file, and SVG rendering supports the interactive filtering and animated updates.

Mminson
90% match
Loading thumbnail…

109550187_HW1

This interactive scatterplot displays the Iris dataset, plotting 150 flowers with selectable axes for the four measured features (sepal and petal dimensions). A drop-down menu encodes a categorical color scale for the three Iris species, while the circles animate and reposition at a fixed radius as the user changes the x or y axis. Built with D3 version 7, the visualization uses `select` chains, `scaleLinear`, `transition`, and the `menu` module’s change event to update the plot. The SVG rendering honors the displayed data from the included CSV file.

Ppatricknicholas27@gmail.com
89% match
Loading thumbnail…

Fork of Iris Scatter Plot

This interactive scatter plot visualizes the classic Iris dataset, allowing users to compare any two of four flower measurements (sepal/petal length/width) via dropdown menus. Points are color-coded by species, with a legend and animated transitions (using D3’s `transition().duration(1000)`) when axes change. The visualization uses D3 v5 to load CSV data, compute linear scales, render SVG axes with `axisBottom` and `axisLeft`, and bind data to circles. Animated positional updates highlight distribution differences between flower classes.

YYi-Qing
88% match
Loading thumbnail…

Fork of Data Visualization Homework 1: Scatter Plots

This interactive scatter plot displays the Iris dataset using D3 v5, with dropdown menus to select which measurement columns appear on the x and y axes. Points are colored by iris species, shown in a categorical color legend. The visualization uses `scaleLinear` for axes, `scaleOrdinal` with `schemeCategory10` for colors, and animates each circle from the center to its position via `transition()`.

MMohammed
88% match
Loading thumbnail…

Fork of Iris Scatter Plot

This interactive scatter plot visualizes the classic Iris dataset, allowing users to explore relationships between sepal and petal measurements across three flower species. Two dropdown menus let viewers select which measurement appears on the x- and y-axes. The visualization uses D3 v5's `scaleLinear`, `axisBottom`, and `axisLeft` to render axes and gridlines, while data points are drawn as SVG circles with color-coded species and an accompanying legend. When the axes change, the circles smoothly transition to their new positions using D3's `transition()`.

HHaowenWeiJohn
87% match
Loading thumbnail…

Fork of Scatter Plot with Menus and Colour and Legend

This interactive scatter plot visualizes the Iris dataset, letting users explore relationships between four flower measurements by switching the X and Y axes via dropdown menus. Each point is colored by species, with a legend clarifying the color encoding. The visualization is built with React functional components and renders SVG marks using D3 v5 scales. It leverages `d3.scaleLinear` for axes, `d3.scaleOrdinal` for categorical colors, and React state hooks to manage attribute selections.

NNikita Toropov
87% match