Skip to main content
SimilarExport ZIP
100%

Ic7 scattered plot

✓ Published1🌍 Public
Ddivyagunuguntla
Last edited Mar 29, 2022
Created on Mar 29, 2022

This interactive scatter plot visualizes the Iris dataset, mapping petal width and sepal length while distinguishing species through different symbols. Built with D3.js and SVG, it employs a reusable chart architecture with modular accessors for configuration. Every 15 seconds, the x-axis dynamically cycles through different dataset columns, animating the plot to reveal alternative feature relationships. The visualization uses D3's linear scales, ordinal symbol scales, and axis generators to create an adaptive, self-updating exploration tool.

AI-generated description

A reusable scatter plot inspired by Towards Reusable Charts.

Shows the Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

ic7 divya scattered plot

This interactive scatter plot visualizes the Iris dataset, showing how petal width and sepal length relate across three flower species. Built with D3.js, the visualization uses an animated SVG display that cycles through different variable pairings every two seconds, while a color-coded legend distinguishes setosa, versicolor, and virginica species. The code implements a reusable scatter plot API with `scaleLinear`, `scaleOrdinal`, and `axisLeft` functions, rendering circles with dynamic sizing based on additional sepal dimensions. Data is loaded from a CSV file hosted on GitHub Gists, and the entire visualization adapts to the browser window dimensions.

Ddivyagunuguntla
93% match
Loading thumbnail…

Iris dataset scatter plot

This interactive scatter plot visualizes the Iris dataset, mapping measurements like petal width and sepal length across three flower species. Using D3.js with an SVG rendering and animation, the chart automatically cycles through different x-axis variables every 15 seconds, updating the visualization via a reusable scatterPlot function. The code employs d3.scaleLinear for axes, d3.scaleOrdinal for symbol types, and d3.symbol to render distinct species markers, with data loaded asynchronously from a CSV source.

Ggayathrikavya
92% match
Loading thumbnail…

ICE 7- Scatter Plot

This animated scatter plot visualizes the Iris dataset, comparing sepal and petal measurements across three flower species. The chart cycles through different attribute pairs every two seconds, shifting which variables map to the x-axis while maintaining species-colored symbols. Built with D3 v6, it uses reusable chart functions with scaleLinear, scaleOrdinal, and symbol generators for rendering SVG paths. The visualization includes axis labels, a color legend for Iris species, and transitions driven by JavaScript’s setInterval, creating an interactive exploration of the dataset’s multivariate relationships.

SSharanya1307
92% match
Loading thumbnail…

ICE-7 Scatterplot

This animated scatterplot visualizes the Iris Dataset, plotting petal width against sepal length with points colored by species (setosa, versicolor, virginica) in red, teal, and blue. Using D3.js, the visualization cycles through different column pairings every two seconds—including sepal width, petal length, and sepal length—via setInterval, dynamically updating the axes and circles without user interaction. The SVG rendering uses d3.scaleLinear, axisLeft, and axisBottom to construct the coordinate system.

BBaswa Sathvika Reddy
91% match
Loading thumbnail…

ICE_7 Iris Scatter Plot

This interactive scatter plot explores the Iris dataset, showing how sepal and petal measurements relate across three flower species, which are distinguished by distinct symbol shapes. The visualization cycles through feature pairings every three seconds, automatically updating the axes to reveal different dimensional relationships. Built as a D3 class, it generates an SVG with scales, axes, and symbol-based marks, while a legend maps each species to its corresponding shape using d3.symbol.

Rrajkumarboddapati2
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…

Fork of Ic7 scattered plot

This scatter plot visualizes the Iris dataset, encoding sepal length on the y-axis and petal width on the x-axis, with species represented by distinct D3 symbol shapes. The chart animates every 15 seconds, cycling through petal_width, sepal_width, petal_length, and sepal_length as the x-axis variable via a `setInterval` callback that updates the chart’s accessor function. Built with reusable chart patterns from `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.symbol`, the SVG rendering animates smoothly. The code imports from D3 v6 and uses a CSV fetched from a GitHub Gist.

KKarnisrikanth
91% match
Loading thumbnail…

Scatterplot_ICE7

This interactive scatter plot displays the Iris dataset, mapping petal width against sepal length. It uses D3 v6 APIs including `scaleLinear`, `scaleOrdinal`, `extent`, and `symbol` to render SVG marks, with colors assigned by species. The visualization cycles through all four numeric data columns every two seconds using `setInterval`, updating the x-axis to show different variable pairs. The reusable chart component, built with a `scatterPlot` factory function, adjusts its axes and marks dynamically via methods like `.xValue()` and `.yValue()`, while axis labels and a title are appended directly to the SVG.

NNiharika-Guthikonda
90% match