Skip to main content
SimilarExport ZIP
100%

Activity 8 Task 1

✓ Published0🌍 Public
AArun Pratap
Last edited Jul 17, 2023
Created on Jul 17, 2023
Forked from Hello VizHub

This interactive scatterplot animates through different pairings of measurements from the classic Iris dataset, cycling the x-axis between petal width, sepal width, petal length, and sepal length while the y-axis is fixed to sepal length. Points are color-coded by species (setosa, versicolor, virginica) with a static legend and animated axis transitions. The visualization loads data via D3’s `csv` function and renders with SVG, using `scaleLinear`, `axisBottom`, and `axisLeft` APIs from D3. A `setInterval` callback updates the plot’s x-scale and redraws the chart, with custom styling from Google Fonts.

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 8 Task 1

This animated scatter plot explores the Iris dataset, cycling through four different x-axis features (petal width, sepal width, petal length, sepal length) while the y-axis remains fixed on sepal length. Data points are colored by species (setosa, versicolor, virginica), with a legend and dynamic axes updating on a timer. The visualization is built with D3.js (v6.7.0), using the `csv` loader, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` utilities. It renders as an SVG with HTML/CSS styling, refreshing the plot at set intervals via `setInterval`.

Ssreekarthanda@gmail.com
93% match
Loading thumbnail…

Activity 8_task1

This animated scatter plot visualizes the Iris flower dataset, showing relationships between sepal and petal measurements with color-coded species (setosa, versicolor, virginica). The visualization cycles through four variable combinations on the x-axis every few seconds using `setInterval`, while the y-axis displays petal width. Built with D3.js v6, it uses `scaleLinear`, `axisBottom`, and `axisLeft` for axes, with SVG circles for data points. The code creates a reusable scatter plot module and renders an interactive legend with custom colors and rotating axis labels.

Mmandadi1999
92% match
Loading thumbnail…

Activity 8_Task_1

This animated scatterplot cycles through four Iris flower measurements, using petal width on the x-axis and sepal length on the y-axis, with points colored by species. It is built with D3 and uses the `csv` loader to fetch the Iris dataset, then repeatedly updates the plot’s x-value via `setInterval`. Each frame, the axes and labels redraw, while a custom legend and title remain static. The code leverages D3’s `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs to handle scaling and axis rendering.

Ssaipaidipalli
92% match
Loading thumbnail…

Reusable Scatter plot Activity 8

This interactive scatter plot animates through different pairings of sepal and petal measurements from the classic Iris dataset, cycling the x-axis variable every few seconds. The visualization color-codes points by species (setosa, versicolor, and virginica) and includes a legend and axis labels. Built with D3 v6, it uses `scaleLinear`, `axisBottom`, `axisLeft`, and `csv` for data loading, alongside a reusable `scatterPlot` module. SVG circles render the marks, with `setInterval` driving the animation and `selectAll`/`join` managing the updating elements.

Vvineelaramulapalli32
91% match
Loading thumbnail…

activity 8_Task 1

This interactive scatterplot visualizes the Iris dataset, comparing sepal and petal measurements across three flower species. The visualization cycles through different measurement combinations on the x-axis using a setInterval, dynamically updating the plot. The code uses D3 v5 with SVG rendering, employing scaleLinear scales, axisBottom, and axisLeft for the chart structure. Animated transitions show data points colored by species, with a custom legend displaying the species names and a title. The example loads data from a CSV file, uses a scatterPlot function for modular chart construction, and demonstrates D3's join pattern for data binding.

Cchsaisriharsha@gmail.com
91% match
Loading thumbnail…

Activity8_Task1

An animated scatterplot of the Iris dataset that cycles through attribute pairings on the x-axis. Built with D3 v6, it uses `scaleLinear`, `axisBottom`, and `axisLeft` to render axes, with a `setInterval` function rotating the x-axis variable among petal width, sepal width, petal length, and sepal length. Circles are colored by species, and a legend and axis labels are drawn directly via SVG. Data is loaded as CSV from a GitHub repository.

Ssrikkanth05
90% match
Loading thumbnail…

Reusable Scatter plot Activity 8

This interactive scatter plot visualizes the Iris dataset, displaying relationships between sepal and petal measurements. It cycles through different x-axis variables (petal width, sepal width, petal length, sepal length) in an animation, with each species point colored distinctly (skyblue, lightgreen, orange). The D3-based implementation loads data via `d3.csv`, uses a custom `scatterPlot` module that leverages `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to build the axes, and renders the animated transitions via `setInterval` and the `join` API for circles.

LLakshmanRangisetti
89% match
Loading thumbnail…

activity 8_task 1

This interactive scatter plot visualizes the Iris dataset, showing the relationship between sepal and petal measurements across three species color-coded as skyblue, lightgreen, and orange. The chart cycles through different x-axis dimensions every few seconds using setInterval, updating both axes and data points. Built with D3 v6, the visualization uses scaleLinear for axis scaling, axisBottom and axisLeft for tick rendering, and a reusable scatterPlot function that accepts configurable width, height, data, and margin parameters. SVG circles represent individual flowers, with a legend and axis labels styled via CSS.

KKeerthiAnnem
89% match