Skip to main content
SimilarExport ZIP
100%

ice - 7

✓ Published0🌍 Public
PPriyanka7002
Last edited Mar 28, 2022
Created on Mar 28, 2022
Forked from 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.

AI-generated description

A reusable scatter plot inspired by Towards Reusable Charts.

Shows the Iris Dataset.

MIT Licensed

Similar vizzes

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
94% match
Loading thumbnail…

testing ice 7

This interactive scatterplot animates through different x-axis variables from the classic Iris dataset, cycling between petal width, sepal width, petal length, and sepal length. Using d3.csv to load the data and d3.scaleLinear for axes, it renders colored circles for each species (setosa, versicolor, virginica) via a setInterval loop that updates the plot's xValue. The visualization uses d3-selection and d3-axis APIs, with SVG rendering and a custom legend showing species colors.

SSnapika
92% match
Loading thumbnail…

Ice 7-1

This interactive scatter plot cycles through four Iris flower measurements—petal width, sepal width, petal length, and sepal length—on the x-axis every two seconds while keeping sepal length on the y-axis. Built with D3.js, it renders each data point as a circle colored by species (green for setosa, grey for versicolor, brown for virginica) against a black background with white axes. The animation uses `setInterval` to update the x-axis scale and re-render the SVG, leveraging D3’s `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` utilities.

AAmar09nath
91% match
Loading thumbnail…

ice 7 Abhishek

This animated scatter plot cycles through different iris flower measurements, mapping petal width, sepal width, petal length, and sepal length against sepal length on the y-axis. The visualization uses D3.js v6 with `scaleLinear`, `axisLeft`, `axisBottom`, and a custom `scatterPlot` function that updates the x-axis attribute every two seconds via `setInterval`. Each circle represents a data point from the Iris dataset, colored by species (setosa, versicolor, virginica). The SVG rendering includes dynamically updated axis labels and a crimson background, with data fetched from a remote CSV file.

Aabhi051197
91% match
Loading thumbnail…

Ice7-1

This interactive scatter plot visualizes the Iris dataset, plotting sepal length against petal width with colored points for each iris species. Every two seconds, the x-axis switches between the four numeric measurements (petal width, sepal width, petal length, sepal length), animating the data through successive views. The chart uses a reusable scatterPlot function built with D3 v6, employing scaleLinear for axes, extent for domains, and axisLeft/axisBottom for grid lines. The SVG renders circles with a fixed radius, while setInterval triggers re-renders with updated xValue mappings.

SSheela2930
91% match
Loading thumbnail…

ICE7 - Scatter Plot

This interactive scatter plot animates through different x-axis variables—petal width, sepal width, petal length, and sepal length—while keeping sepal length on the y-axis, using the classic Iris dataset. Circles are colored by species (setosa, versicolor, virginica) with a custom legend, and the plot updates every few seconds via `setInterval`. Built with D3 v6, it uses `scaleLinear`, `axisLeft`, `axisBottom`, and a custom `scatterPlot` function, rendering as SVG with appended axis labels and a rotating title.

Aavinashchinta99
91% 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
91% match
Loading thumbnail…

Scatter plot ICE 7

This interactive scatter plot animates through different axis pairings of the Iris flower dataset, cycling between sepal and petal measurements. Colored circles represent the three species—setosa, versicolor, and virginica—with a static legend and dynamically updating axes. Built with D3.js v6, the visualization uses `scaleLinear`, `axisLeft`, `axisBottom`, and a `setInterval` loop to redraw the plot every few seconds. The SVG rendering includes custom labels, a title, and a rotating x-axis selection, with data loaded asynchronously via `d3.csv`.

Kkakumanusreya
91% match