Skip to main content
SimilarExport ZIP
100%

Activity 7 Practice

✓ Published0🌍 Public
Hharshabandi3060@gmail.com
Last edited Nov 5, 2024
Created on Nov 5, 2024
Forked from Hello VizHub

This interactive iris scatterplot cycles through flower measurements on the x-axis using a `setInterval`. It loads CSV data from a GitHub gist and uses `d3.csv` for parsing, `scaleLinear` and `d3.axisBottom`/`axisLeft` from D3 6.7.0 to build axes. A custom ES6 module `scatterPlot` structures the reusable plot, while circles are colored by species (setosa, versicolor, virginica). The SVG animation rotates axes across petal and sepal dimensions, with dynamic axis labels, a legend, and a title rendered via `d3.select` and `.append`.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity_7

This animated scatter plot explores the Iris dataset by cycling through different flower measurements on the x-axis. It uses D3.js (v6.7.0) with a custom reusable `scatterPlot` module that leverages `scaleLinear`, `axisLeft`, and `axisBottom` to render axes. Data is loaded via `d3.csv`, and a `setInterval` timer updates the plot’s x-value every few seconds, toggling between petal width, sepal width, petal length, and sepal length. Circles are colored by species (setosa, versicolor, virginica) with a legend, title, and axis labels rendered as SVG text elements.

Kkandooriabhiram@gmail.com
91% match
Loading thumbnail…

Activity 6

This animated scatter plot cycles through four Iris flower measurements—petal width, sepal width, petal length, and sepal length—on the x-axis, with sepal length on the y-axis. D3 v6 loads the Iris dataset via `d3.csv`, scales axes with `scaleLinear`, and renders axis ticks using `axisLeft` and `axisBottom`. A `setInterval` updates the x-value accessor, triggering a re-render of the SVG via the custom `scatterPlot` function. Circles are colored by species (setosa, versicolor, virginica) and accompanied by a legend and axis labels.

Aamireddy.sw@gmail.com
91% match
Loading thumbnail…

activity7

This animated scatter plot cycles through different Iris flower measurements, displaying petal width, sepal width, petal length, and sepal length on the x-axis while keeping sepal length on the y-axis. Points are colored by species (setosa, versicolor, virginica) with a legend and axis labels. Built with D3.js, it loads CSV data, uses `d3.csv` for parsing, and relies on `setInterval` to rotate the displayed variable, re-rendering SVG circles and text each cycle.

TThai Ha Dang
91% match
Loading thumbnail…

Activity-7 Tutorial

This animated scatterplot cycles through four Iris flower measurements, plotting petal width, sepal width, petal length, and sepal length on the x-axis while sepal length remains on the y-axis. The visualization uses D3.js modules imported via UNPKG, including `scaleLinear`, `axisLeft`, `axisBottom`, and `csv` for data parsing, with a custom `scatterPlot` function handling the SVG rendering. Circles are color-coded by species—lightblue for setosa, lightgreen for versicolor, and orange for virginica—with a legend and axis labels updated every two seconds via `setInterval`. The code demonstrates local ES6 module imports and dynamic chart reconfiguration with smooth transitions.

Aabjalshaik02@gmail.com
91% match
Loading thumbnail…

Activity_7.1

This interactive scatter plot cycles through different Iris flower measurements, animating the x-axis to display petal width, sepal width, petal length, and sepal length in sequence. The visualization uses D3.js to load CSV data, scale axes, and render animated circles colored by species, with a custom legend and axis labels updating dynamically.

Ddabbararakshitha@gmail.com
91% match
Loading thumbnail…

Activity 6

This animated scatter plot explores the classic Iris dataset, cycling through different flower measurements on the x-axis—petal width, sepal width, petal length, and sepal length—against sepal length on the y-axis. The code loads data via D3's `csv` function and builds a reusable scatter plot using `scaleLinear`, `axisLeft`, and `axisBottom`. Each species (setosa, versicolor, virginica) receives a distinct color, and a legend with labeled circles updates alongside the axes. The visualization repeats its axis transitions every few seconds using `setInterval`, with SVG elements rendered directly to the page.

Ddandudivya98@gmail.com
90% match
Loading thumbnail…

Activity7 Tutorial

This animated scatter plot cycles through different Iris flower measurements, switching the x-axis dimension every few seconds while keeping sepal length on the y-axis. Data points are color-coded by species (setosa, versicolor, virginica) with a legend and title displayed on screen. Built with D3 v6, it uses `scaleLinear`, `axisBottom`, `axisLeft`, and `setInterval` to update the visualization, reading the CSV dataset from a GitHub gist and rendering as SVG.

SSai Gottumukkala
90% match
Loading thumbnail…

Activity_9_task_9

This animated scatter plot cycles through pairs of Iris flower measurements, highlighting sepal length on the y-axis while rotating through petal width, sepal width, petal length, and sepal length on the x-axis. Circles are color-coded by species (setosa, versicolor, virginica) using a legend. Built with D3 v6, it loads CSV data from GitHub, uses local ES6 modules for a reusable `scatterPlot` function, and leverages `scaleLinear`, `axisLeft`, and `axisBottom` for axes, with a `setInterval` driving the axis updates.

HHarinathChakali33@gmail.com
90% match