Acitivity 7_tutorial

100%

Acitivity 7_tutorial

✓ Published0🌍 Public

Last edited Apr 6, 2025

Created on Apr 6, 2025

This animated scatter plot visualizes the Iris dataset, cycling through different feature combinations on the x-axis while displaying sepal length on the y-axis. Points are colored by species—skyblue for setosa, lightgreen for versicolor, and orange for virginica—with legend labels identifying each group. The visualization is built using D3.js scaleLinear, axisLeft, axisBottom, extent, and csv loading, with a reusable scatterPlot function that updates axes and circles via setInterval. It renders as an SVG with custom styling and animated transitions between four variable pairs.

AI-generated description

A demonstration of reusable scatter plot.

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 7 tutorial

This animated scatter plot explores the classic Iris dataset, cycling through four different feature pairings on the x-axis while y-axis remains sepal length. Built with D3.js 6.7.0, it demonstrates a reusable scatter plot module using scaleLinear, axisLeft, and axisBottom APIs. The visualization shows species-colored points (setosa, versicolor, virginica) with a static legend, and dynamically updates axes and labels via setInterval. The rendering uses SVG with custom styling, including italic axis labels and a bold title overlay.

Aanisha.peddireddy@gmail.com

93% match

Loading thumbnail…

Activity7.1_Tutorial

This animated scatter plot demonstrates the Iris dataset, cycling through different combinations of sepal and petal measurements on the x-axis. It shows how the three species (setosa, versicolor, and virginica) cluster differently depending on which features are compared. The visualization uses the D3.js library, specifically `csv`, `select`, `scaleLinear`, and `axisLeft`/`axisBottom` APIs to create the plot and its axes. The scatter plot updates every few seconds, using a `setInterval` loop to rotate through the four measurement columns as the x-axis variable. The SVG rendering includes custom-styled points, a color legend, and axis labels.

SSai Praveen Lokavarapu

92% match

Loading thumbnail…

Activity 7 tutorial

This interactive scatter plot visualizes the Iris flower dataset, animating through different combinations of sepal and petal measurements. The visualization cycles through four variable pairings every few seconds, with points colored by species (setosa, versicolor, virginica) and accompanied by a legend and axis labels. Built with D3 v6, it uses `d3.csv` for data loading, `scaleLinear` and `axisLeft`/`axisBottom` for scales and axes, and `setInterval` to trigger re-renders of the reusable `scatterPlot` function.

Ccharanshiva769@gmail.com

92% match

Loading thumbnail…

Activity7 Tutorial

This animated scatter plot cycles through different Iris flower measurements, switching the x-axis dimension every few seconds while keeping sepal length on the y-axis. Data points are color-coded by species (setosa, versicolor, virginica) with a legend and title displayed on screen. Built with D3 v6, it uses `scaleLinear`, `axisBottom`, `axisLeft`, and `setInterval` to update the visualization, reading the CSV dataset from a GitHub gist and rendering as SVG.

SSai Gottumukkala

91% match

Loading thumbnail…

activity 7 tutorial

This animated scatter plot visualizes the Iris flower dataset, cycling through different pairings of sepal and petal measurements on the x-axis every few seconds while petal width and sepal length remain on the y-axis. Data points are color-coded by species (setosa, versicolor, virginica) with a legend and rotating axis labels. Built with D3.js v6, it uses `scaleLinear`, `axisLeft`, `axisBottom`, and `setInterval` to update the plot dynamically. The SVG renders circles with custom fill colors and includes a reusable `scatterPlot` module for configuration.

Ssudheervnarasimha1@gmail.com

91% match

Loading thumbnail…

Activity 7 Tutorial

This example visualizes the Iris dataset as an animated scatterplot, cycling through four flower measurements as x-axis values while keeping sepal length on the y-axis. Points are colored by species (Setosa, Versicolor, Virginica) with matching legend markers. The animation cycles through petal width, sepal width, petal length, and sepal length every few seconds. The code uses D3 v6 modules, including `csv`, `scaleLinear`, `axisLeft`, `axisBottom`, and `extent`, with a reusable scatter plot function and ES6 module imports. The SVG renders with custom labels, a color legend, and axis titles that update per iteration.

KKhushi Desai

91% match

Loading thumbnail…

Activity7-tutorial

This animated scatter plot visualizes the Iris dataset, cycling through different x-axis variables (petal width, sepal width, petal length, sepal length) while keeping sepal length on the y-axis. The SVG renders colored circles by species, with a legend and axis labels updated on an interval. It uses D3's `csv`, `scaleLinear`, `axisLeft`, `axisBottom`, and `scatterPlot` reusable component to handle data parsing and chart rendering.

Ssriyaalugupalli@my.unt.edu

90% match

Loading thumbnail…

Activity-7

Animated scatter plot of the Iris dataset cycles through four feature combinations, using petal width, sepal width, petal length, and sepal length on the x-axis while keeping sepal length on the y-axis. Points are colored by species (setosa, versicolor, virginica) with a legend and axis labels. The visualization uses a reusable scatter plot module built on D3 scales and axes, updating via `setInterval`. Data is loaded from a CSV file, rendered as SVG circles, and includes dynamic axis titles and a title.

Rrahul.bonu524@gmail.com

90% match