Sreekar Ice 7

100%

✓ Published0🌍 Public

Last edited Mar 29, 2022

Created on Mar 29, 2022

Forked from Fork of Reusable D3 Scatter Plot

This animated scatter plot visualizes the classic Iris dataset, cycling through four different feature pairs on the x-axis (petal width, sepal width, petal length, and sepal length) every 1.5 seconds. Each point represents a flower, colored by species according to a categorical scale. The visualization uses D3.js’s `scaleLinear`, `scaleOrdinal`, `axisLeft`, and `axisBottom` APIs to construct the plot and its axes, while the `select` and `join` methods handle the SVG rendering. The data is loaded from a remote CSV via `d3.csv`.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Sreekar ICE7

This animated scatter plot explores the classic Iris dataset, cycling through four feature pairings every two seconds. The visualization colors each species differently—setosa in green, versicolor in indigo, and virginica in red—using D3’s `selectAll` and `.join` to update SVG circles smoothly. The chart is rendered via a custom `scatterPlot` module that leverages D3’s `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` for axes and scaling, while the interval-based animation shifts the x-axis mapping between petal and sepal measurements.

SSreekarveeravelly

94% match

Loading thumbnail…

Sreekar Ice 7

This animated scatter plot cycles through four Iris flower measurements (petal width, sepal width, petal length, sepal length) every two seconds, using D3 scales and axes to map each feature pair. The SVG circles are colored by species (setosa in yellow, versicolor in blue, virginica in green) and use irregular radii from sepal measurements, though the animation primarily shifts axis domains. Data is loaded as CSV from a GitHub gist, with the scatterPlot module handling axis generation via d3.axisLeft and d3.axisBottom, while a setInterval drives the rotating variable selection.

SSreekarveeravelly

94% match

Loading thumbnail…

ICE-7

This interactive scatter plot visualizes the Iris Dataset, cycling through different feature pairings (petal width, sepal width, petal length, and sepal length) every two seconds. Built with D3.js, it uses a reusable scatter plot module with `scaleLinear` for axes, `extent` for data domains, and `axisLeft`/`axisBottom` for tick marks, rendered as animated SVG in a full-browser view.

Ssowmyanagula@my.unt.edu

90% match

Loading thumbnail…

ice - 7

This animated scatter plot visualizes the Iris Dataset, cycling through different pairings of sepal and petal measurements every two seconds. The visualization uses D3.js version 6.7.0, employing `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to build the chart, with species color-coded as red, blue, or grey. Rendered as an SVG, the plot updates dynamically by changing the x-axis variable through a `setInterval` loop, while the reusable `scatterPlot` chart component handles the layout and axis rendering.

SSaikiran2029

90% match

Loading thumbnail…

ice - 7

This animated scatter plot visualizes the Iris dataset, cycling through different feature pairs every two seconds. Each point represents a flower sample, colored by species (setosa, versicolor, or virginica) and positioned using d3’s `scaleLinear` and `extent` for axes. The reusable `scatterPlot` function, imported from a separate module, renders axes via `axisLeft` and `axisBottom`. The SVG is constructed with d3 selections, and the animation uses `setInterval` to update the x-value mapping. Data is loaded as CSV from a GitHub gist, and the plot’s axes are labeled as “X-AXIS” and “Y-AXIS.”

Ssri7harsha

90% match

Loading thumbnail…

ice - 7

This animated scatter plot cycles through different x-axis variables from the Iris dataset, changing every two seconds to compare sepal and petal measurements. The visualization uses D3’s scaleLinear, axisBottom, and axisLeft APIs to render axes and circles colored by species, with the x-axis switching between petal_width, sepal_width, petal_length, and sepal_length. Rendering uses SVG animations driven by setInterval, and the dataset is loaded via d3.csv from a GitHub repository.

PPriyanka7002

89% match

Loading thumbnail…

ICE7 - Scatter Plot

This animated scatter plot visualizes the Iris flower dataset, cycling through four different measurements (petal width, sepal width, petal length, sepal length) on the x-axis while keeping sepal length on the y-axis. Each species is color-coded—setosa in orange, versicolor in blue, and virginica in black—with a static legend and labeled axes. The visualization uses D3.js (v6.7.0) with its `scaleLinear`, `axisLeft`, and `axisBottom` APIs, loading data via `d3.csv` and updating positions on a timer with `setInterval`. Data comes from a GitHub-hosted medals CSV file, and the SVG rendering includes circles with custom radii per data point.

Aavinashchinta99

89% match

Loading thumbnail…

Ice7

This animated scatter plot cycles through the four Iris flower measurements (petal width, sepal width, petal length, and sepal length) on the x-axis every two seconds, while the y-axis remains fixed on sepal length. Using the D3.js library, the visualization transitions smoothly by updating the linear scale domain and animating circle positions and axis ticks via `transition().duration()`. The data is loaded from a CSV file using `d3.csv`, and the plot is rendered as an SVG that resizes to fit the browser window.

HHarshithaDontha@my.unt.edu

89% match