Skip to main content
SimilarExport ZIP
100%

Fork of Fork of Reusable D3 Scatter Plot- ICE7

✓ Published0🌍 Public
Sspandhanabadekol
Last edited Mar 27, 2022
Created on Mar 27, 2022

This scatter plot visualizes the Iris dataset, showing the relationship between petal width and sepal length, with points colored by species (setosa, versicolor, virginica). The visualization animates every two seconds, cycling the x-axis through petal_width, sepal_width, petal_length, and sepal_length using d3's scaleLinear and extent functions. Built with D3 v6, it renders SVG circles with elliptical dimensions derived from sepal measurements, and includes axes generated via axisLeft and axisBottom.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot visualizes the Iris flower dataset, cycling through different petal and sepal measurements on the x-axis while plotting sepal length on the y-axis. Data points are color-coded by species (setosa in orange, versicolor in blue, virginica in white) with a fixed legend. Built with D3 v6, the visualization uses a custom `scatterPlot` module with `scaleLinear`, `axisLeft`, and `axisBottom` to render axes, while `setInterval` cycles through four measurement columns every few seconds. The SVG rendering includes labeled axes and a species legend, with all text styled white against a black background.

AAnanthulaaditya
95% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This interactive scatter plot visualizes the Iris dataset, showcasing the relationships between sepal and petal measurements. The visualization cycles through different x-axis variables (petal width, sepal width, petal length, and sepal length) at intervals, animating the data points accordingly. Points are colored by species—orange for setosa, blue for versicolor, and white for virginica—with a legend and axis labels. Built with D3 v6, the code uses `csv` for data loading, `select` for SVG manipulation, and a custom `scatterPlot` module with `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` for chart rendering.

MMgk1255
95% match
Loading thumbnail…

Fork of Fork of Reusable D3 Scatter Plot- ICE7

This visualization presents the classic Iris dataset as an animated scatter plot, cycling through different pairings of sepal and petal measurements on the x-axis while keeping petal width on the y-axis. Each species—setosa, versicolor, and virginica—is color-coded in red, cyan, and grey respectively, with data points rendered as SVG circles and a legend showing the color mapping. The animation updates the x-axis scale and labels via `setInterval`, and the plot is built using D3 v6 APIs including `scaleLinear`, `extent`, `axisLeft`, and `axisBottom`. The data is loaded from a CSV URL, and the plot re-renders its axes and circles on each interval tick.

RRupeshGandham
95% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot visualizes the Iris flower dataset, cycling through four different x-axis measurements—petal width, sepal width, petal length, and sepal length—while keeping sepal length fixed on the y-axis. Each data point is colored by species (setosa, versicolor, virginica), with a static legend. The example uses D3 v6 APIs such as `scaleLinear`, `axisLeft`, `axisBottom`, and `setInterval` to update the chart, rendering SVG circles and text with a custom `scatterPlot` reusable function.

AArefa Patwary
94% match
Loading thumbnail…

Fork of ICE- 7 Reusable Scatter Plot

This visualization displays the Iris Dataset as a scatter plot of petal width against sepal length, with each species colored according to the d3.schemeCategory10 ordinal scale. The chart uses d3.scaleLinear for both axes and d3.axisLeft/axisBottom for gridlines. A setInterval updates the x-axis variable every 10 seconds, cycling through petal_width, sepal_width, petal_length, and sepal_length. Data points render as SVG paths with d3.symbol shapes differentiated by species, animated through D3’s data join and update pattern.

Bbhanuprasadk19
94% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot cycles through different x-axis variables—petal width, sepal width, petal length, and sepal length—for the classic Iris dataset, with y-axis fixed to sepal length. Each flower species is color-coded (steelblue, fuchsia, green) and rendered as circles with distinct radii and fill properties. Using D3 v6 (d3.csv, d3.scaleLinear, d3.axisLeft, d3.axisBottom), the visualization updates every interval via setInterval, rebuilding the axes and labels for each dimension. The code also includes a custom legend and axis titles, with SVG rendering for all marks and text.

SSonuSriN
94% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This interactive scatter plot, built with D3 v6, visualizes the Iris dataset. It cycles through four feature combinations (sepal and petal dimensions) on the x-axis, updating every few seconds while the y-axis remains sepal length. Data points are colored by species (Setosa, Versicolor, Virginica), with a static legend and axis labels. The visualization uses SVG for rendering and animation, with axes and scales computed via `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` from the D3 API.

SSnapika
94% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot displays the Iris flower dataset, cycling through four different feature pairings on the x-axis every few seconds to highlight relationships between sepal and petal measurements. Circles represent individual flowers, colored by species (Setosa in orange, Versicolor in blue, Virginica in black), with a fixed legend. Built with D3 v6, it reuses a custom `scatterPlot` module that applies `scaleLinear`, `axisLeft`, and `axisBottom` to render axes, while `setInterval` triggers updates and re-renders the SVG elements.

Rrkhan22
94% match