Fork of Reusable Scatter plot Activity7.1

100%

Fork of Reusable Scatter plot Activity7.1

✓ Published0🌍 Public

Last edited Nov 1, 2024

Created on Nov 1, 2024

Forked from Reusable Scatter plot Activity 8

This example demonstrates an interactive scatter plot of the Iris dataset, cycling through different feature combinations on the x-axis every few seconds. The plot displays petal width against sepal length, with points colored by species (setosa, versicolor, virginica) and varying ellipse shapes based on sepal dimensions. It uses D3.js v6 with reusable chart components via `scatterPlot`, `scaleLinear`, `axisLeft`, and `axisBottom` to render SVG circles and axes. The animation switches x-axis features using `setInterval`, while custom legend, title, and axis labels are appended dynamically.

AI-generated description

A demonstration of reusable scatter plot.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This animated scatter plot displays the Iris flower dataset, cycling through four feature pairings (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) using static legend markers. Built with D3 v6, the visualization uses `scaleLinear`, `axisLeft`, `axisBottom`, and `csv` parsing, with a reusable `scatterPlot` module. A `setInterval` triggers axis updates every few seconds, while SVG circles are appended directly to the body with custom `rx` and `ry` attributes.

Mmythripopuri2001@gmail.com

94% match

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This animated scatter plot explores the Iris dataset, cycling through different feature pairings on the x-axis while keeping sepal length on the y-axis. Colored circles represent three species of iris flowers. The visualization is built using D3's `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs within a reusable `scatterPlot` function. A `setInterval` loop updates the plot's x-value mapping, redrawing axes and text labels accordingly. The code also includes custom legend labels, a title, and styling applied through SVG attributes.

AAamir Hameed mir

94% match

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

A scatterplot of the Iris dataset animates through combinations of its four features on the x-axis (petal width, sepal width, petal length, sepal length) against sepal length on the y-axis. Points are colored by species (setosa, versicolor, virginica). Built with D3 v6, it uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` from a custom `scatterPlot` module, with an SVG render and `setInterval` for cycling axes.

Ssravya.mundluru@gmail.com

93% match

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This interactive scatter plot animates through the Iris dataset, cycling the x-axis through petal width, sepal width, petal length, and sepal length at intervals. Points are color-coded by species (setosa, versicolor, virginica) using skyblue, lightgreen, and orange. Built with d3.v6, it uses the reusable `scatterPlot()` module with `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to render SVG circles and axes. Text labels for the legend, title, and axis names are appended dynamically, while a `setInterval` updates the chart in an animation.

Bbudalavijay2001@gmail.com

93% match

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This interactive scatter plot visualizes the Iris dataset, displaying petal and sepal measurements with points colored by species (setosa, versicolor, virginica). Using D3.js v6 with SVG rendering, the visualization cycles through four variable combinations on the x-axis at regular intervals via `setInterval`, while the y-axis remains fixed. The chart includes a species legend, axis labels, and a title, with the reusable `scatterPlot` module handling scales and axes through D3's `scaleLinear`, `axisLeft`, and `axisBottom`. Data is loaded asynchronously from a GitHub-hosted CSV file.

Aabjalshaik02@gmail.com

93% match

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

An animated scatter plot displays the Iris dataset, cycling through four flower measurements on the x-axis while keeping sepal length on the y-axis. Circles represent individual flowers, colored by species (setosa, versicolor, virginica) with a legend and axis labels. Built with D3 v6, the visualization uses `scaleLinear`, `axisLeft`, and `axisBottom` within a reusable `scatterPlot` module, and updates via `setInterval` to rotate the x-axis variable every few seconds.

Vvchittimadha@gmail.com

93% match

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This example demonstrates a dynamic, animated scatterplot of the Iris flower dataset, showcasing how different species cluster across various measurement combinations. Through a cycling interval, the plot iterates through different x-axis variables (petal width, sepal width, petal length, and sepal length) while keeping sepal length on the y-axis, with species color-coded as skyblue, lightgreen, and orange. Built with D3.js version 6.7, the visualization uses a custom reusable `scatterPlot` function leveraging `scaleLinear`, `axisLeft`, `axisBottom`, and `csv` for data loading, rendering circles in SVG with animated transitions and a static legend.

Rrushithareddyy

93% match

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8 v

This interactive scatter plot displays the Iris dataset, showing relationships between petal and sepal measurements with points colored by species (setosa, versicolor, virginica). The visualization cycles through different x-axis variables every few seconds, while the y-axis remains fixed on sepal length. Built with D3.js, it uses a custom reusable scatterPlot function with SVG circles, axis scales, and a legend. The code employs `scaleLinear`, `axisLeft`, `axisBottom`, and `setInterval` for the rotating axis animation, rendering data from a CSV file fetched via D3's `csv` method.

Vvikramkotlo9@gmail.com

93% match