ic7 divya scattered plot

100%

ic7 divya scattered plot

✓ Published0🌍 Public

Last edited Mar 29, 2022

Created on Mar 29, 2022

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.

AI-generated description

A reusable scatter plot inspired by Towards Reusable Charts.

Shows the Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Ic7 scattered plot

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.

Ddivyagunuguntla

93% match

Loading thumbnail…

ICE7-11540639-Reusable Scatter Plot

This interactive scatter plot visualizes the Iris dataset, showing the relationship between petal length, petal width, sepal length, and sepal width, with each species color-coded (setosa as orangered, versicolor as green, and virginica as navy). The visualization uses D3.js (v6.7.0) with a reusable scatter plot component, loading data via `csv()`, and rendering SVG circles with animated transitions. Every two seconds, the plot cycles through different axis columns using `setInterval()` and reassigns the x-axis value, causing the scatter plot to dynamically update its layout while the y-axis remains fixed to sepal length.

SSravanthi Silla

91% 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…

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

90% match

Loading thumbnail…

ICE7_Reusable D3 Scatter Plot

This interactive scatter plot visualizes the Iris dataset, displaying relationships between petal and sepal measurements. The visualization cycles through four variable combinations every two seconds, allowing comparison of different attribute pairings. Each species—setosa, versicolor, and virginica—is distinguished by color, with a legend identifying the groups. The plot is built as a reusable D3 module, using `scaleLinear`, `scaleOrdinal`, `axisLeft`, and `axisBottom` from the d3 library for axes and scales. SVG circles represent data points, with animated axis updates driven by `setInterval`.

AAkrutiKhurana2103

90% match

Loading thumbnail…

DV ICE-7

This interactive scatter plot visualizes the Iris dataset, displaying a point for each flower specimen. It uses petal width on the x-axis and sepal length on the y-axis, with colors representing species (versicolor in yellow, virginica in light blue, setosa in orange). The plot cycles through all four numeric columns every two seconds, updating the axes and point positions using D3 v6's `setInterval`, `scaleLinear`, `axisLeft`, and `axisBottom` functions. The SVG is rendered full-screen with custom text labels and styling defined in external CSS.

Ssowmyanagula@my.unt.edu

89% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the Iris dataset, showing petal width against sepal length, with each species color-coded (setosa in gold, versicolor in teal, and virginica in red). The visualization cycles through four attribute combinations every two seconds, updating both the axes and circle positions. Built with D3 v6, it uses `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.axisLeft`, and `d3.axisBottom` within a reusable `scatterPlot` function, rendering as SVG circles with HTML labels.

Pprajoth0405

89% 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

89% match