Skip to main content
SimilarExport ZIP
100%

Activity6_Task3

✓ Published0🌍 Public
SSiddhardha
Last edited Oct 23, 2024
Created on Oct 23, 2024
Forked from Hello VizHub

This example displays a scatter plot of the Iris dataset, plotting petal length on the x-axis and petal width on the y-axis, with each point colored by species (skyblue, lightgreen, or orange). It also encodes sepal length and width as the horizontal and vertical radii of each circle, creating an elliptical marker for each observation. The visualization loads CSV data from a GitHub gist using `d3.csv` and renders SVG circles via D3 v6 selections with `join`. Axes are generated using `d3.axisLeft` and `d3.axisBottom`, while scales are created with `d3.scaleLinear` and domains from `d3.extent`.

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…

Activity6_Task3.1

This example shows a scatter plot of the Iris dataset, mapping petal length to the x-axis and petal width to the y-axis. It colors each point by species—setosa in skyblue, versicolor in lightgreen, and virginica in orange—while also encoding sepal length and width as additional shape properties on each circle. The visualization loads data from a CSV via a GitHub gist, uses D3 v6 modules such as `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` for scales and axes, and renders circles in an SVG. Axis labels are added for petal and sepal length.

KKondreddy Saikiran reddy
95% match
Loading thumbnail…

Activity6_Task3.1

This example visualizes the Iris dataset as a scatter plot, displaying petal length and petal width on the axes while coloring each point by species (setosa, versicolor, or virginica). It also encodes sepal length and width as the x- and y-radii of the circular markers. The visualization loads CSV data from a GitHub gist, uses D3 v6 modules including `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `select`, and renders all marks as SVG circles. Axis labels are green, and the plot resizes to the full browser window.

Rrakesh.kavuru@outlook.com
95% match
Loading thumbnail…

Activity6_Task3

A scatter plot of the Iris dataset displays petal length against petal width, with circles colored by species (setosa, versicolor, virginica) using skyblue, lightgreen, and orange. The plot also encodes sepal length and width as circle radii (`rx`, `ry`), creating elliptical marks. The visualization loads data via `d3.csv`, scales axes with `scaleLinear` and `extent`, renders SVG circles via `selectAll` and `join`, and adds axes with `axisLeft` and `axisBottom`. Axis labels are rotated text elements. Data is sourced from a GitHub-hosted CSV file.

Hhaneesh@gctc.in
95% match
Loading thumbnail…

Activity6_Task3

This example displays the Iris dataset as an SVG scatter plot, coloring each point by species (skyblue, lightgreen, or orange) and mapping petal length and petal width to the x- and y-axes. It uses d3.csv to load the data, d3.scaleLinear and d3.extent for scales, and d3.axisLeft/axisBottom for labeled axes. The code appends circles via d3.selectAll().data().join(), setting separate radii and positions, though the mark also stores sepal dimensions without plotting them. The visualization fills the browser window, with green axis labels for petal length and sepal length.

Sshettisowmya01@gmail.com
94% match
Loading thumbnail…

activity_6_task3

This example presents a scatter plot of the Iris dataset, visualizing the relationship between petal length on the x-axis and petal width on the y-axis, with circles colored by species (setosa, versicolor, and virginica) using skyblue, lightgreen, and orange. The chart also encodes sepal length and width as circle radii properties on the SVG elements. It loads CSV data from a GitHub repository, parses numeric fields, and uses D3 v6 APIs including `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `select` to render axes and circles in an SVG canvas sized to the browser window.

HHarinathChakali33@gmail.com
94% match
Loading thumbnail…

Activity6_Task3

This example displays a scatter plot of the Iris dataset, plotting petal length against petal width, with each point colored by species (setosa, versicolor, or virginica) using a custom marker function. It loads the CSV data from a GitHub repository via `d3.csv`, then uses `d3.scaleLinear` with `extent` to map the data to pixel coordinates. The visualization renders circles as SVG elements using `select('body').append('svg')`, with axes drawn via `d3.axisLeft` and `d3.axisBottom`. The code also includes unused sepal length and width values mapped to circle `rx` and `ry` attributes, though the radius remains fixed.

Mmoulidomar@hotmail.com
94% match
Loading thumbnail…

Activity6_task3.1

This example visualizes the Iris dataset as a scatter plot, using petal length on the x-axis and petal width on the y-axis. It encodes species membership through circle colors (skyblue, lightgreen, orange) while also binding sepal length and width as additional attributes (`rx`, `ry`) on each circle. The visualization loads CSV data from a GitHub gist, parses numeric fields, and uses D3 v6 APIs including `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `selectAll().data().join()` to render SVG circles. Axis labels are added via `svg.append('text')`, with the plot sized to the browser window dimensions.

Nnandasaipalankius@gmail.com
94% match
Loading thumbnail…

Activity6_Task3

This example shows the classic Iris dataset as a scatter plot, displaying petal length on the x-axis, petal width on the y-axis, and using color-coded circles to distinguish the three species. The plot is rendered as an SVG using D3 v6, with the data loaded from a GitHub-hosted CSV file. The code uses `d3.csv`, `d3.scaleLinear`, `d3.extent`, `d3.axisLeft`, and `d3.axisBottom` to build the visualization. Circle radii are fixed, while circle attributes for width and height are set from the dataset. Axis labels are manually placed with text elements, and species-specific colors are assigned via a switch statement.

Nnsairitwikreddy@gmail.com
94% match