Skip to main content
SimilarExport ZIP
100%

Activity6_Task3

✓ Published0🌍 Public
JJayanth Reddy Sripathi
Last edited Oct 22, 2024
Created on Oct 22, 2024
Forked from Hello VizHub

This example displays a scatter plot of the Iris dataset, mapping petal length and width as the primary axes while encoding sepal length and width into the size and shape of the circular markers. Each of the three iris species is distinguished by a unique fill color: sky blue, light green, and orange. The visualization uses D3 version 6, loaded via a CDN, and leverages the `d3.csv` loader to fetch the data from a GitHub repository. It builds the plot using `d3.select` to create an SVG, with scales from `d3.scaleLinear`, axes from `d3.axisLeft` and `d3.axisBottom`, and computes data extents via `d3.extent`. The code sets the circle radii, along with `rx` and `ry` attributes, to reflect the additional sepal dimensions, while axis labels are added as text elements.

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.2

This example presents a scatter plot of the Iris dataset, visualizing sepal length against petal length with points colored and shaped by species. The visualization is built using D3 v7, leveraging modules like `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.symbolsFill`, and `d3.symbol` to map data values to positions and shapes. It also demonstrates custom reusable functions, including `axes` for drawing axes with labels and `shapeLegend` for a categorical legend. Data is fetched asynchronously from a remote CSV file and parsed with `d3.csvParse`. The chart dynamically fills the browser window using `window.innerWidth` and `window.innerHeight`.

JJayanth Reddy Sripathi
95% 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 displays a scatter plot of the Iris dataset, mapping petal length and width as the primary x and y coordinates while encoding species with distinct colors (skyblue, lightgreen, orange). It also overrides circle radii with sepal length and width values via `rx` and `ry`, creating elliptical points. The visualization uses D3 v6 APIs including `csv`, `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and SVG circle joins. Data is loaded from a remote CSV URL, and the chart is rendered to an SVG canvas with custom axis labels.

SSahithi.R
94% match
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
94% match
Loading thumbnail…

Activity6_Task3

This example presents a scatter plot of the Iris dataset, visualizing petal length and width for different species. The plot uses colored circles (skyblue, lightgreen, orange) to distinguish between setosa, versicolor, and virginica flowers, with each point’s size reflecting sepal dimensions via the `rx` and `ry` attributes. Built with D3 v6, it loads CSV data from a GitHub repository, uses `scaleLinear` and `extent` for axis scaling, and renders axes with `axisLeft` and `axisBottom`. The SVG output includes labeled axes and a centered title.

Aasimcyb@gmail.com
94% match
Loading thumbnail…

Activity6_Task3

This scatter plot displays the Iris dataset, using petal length and petal width to position each flower, with colors distinguishing the three species (setosa, versicolor, and virginica). Additional sepal measurements are encoded as circle radii, though the visual range of this encoding is limited. The visualization is built with D3 v6, loading CSV data from a remote URL, and rendering SVG circles scaled via `scaleLinear` with axes generated by `axisLeft` and `axisBottom`. The code explicitly assigns circle attributes for position, fill color, and radius, and labels the axes for petal and sepal dimensions.

Aamarnadhkari98@gmail.com
94% match
Loading thumbnail…

activity6_task3

This example displays a scatter plot of the Iris dataset, using petal length and sepal length as the x and y axes while encoding species identity through circle color. The visualization is rendered as an SVG using D3 v6, leveraging the `csv`, `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `select` APIs from the library. Data is loaded from a remote CSV file, and axis labels are added as static text elements. The circles’ `rx` and `ry` attributes are set to the sepal width and petal width values, though the radius is fixed at 5 pixels.

Ssanjanaadapa7@gmail.com
94% match
Loading thumbnail…

Activity6_Task3

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`.

SSiddhardha
94% match