Skip to main content
SimilarExport ZIP
100%

Dataset Scatter Plot

✓ Published0🌍 Public
AAkrutiKhurana2103
Last edited Mar 6, 2022
Created on Mar 5, 2022

This example visualizes the Iris Dataset as a scatter plot, mapping petal length and width along the x- and y-axes, with circles colored by species (setosa in red, versicolor in pink, and virginica in blue). It also encodes sepal length and width as the rx and ry attributes of each circle, though they remain unchanged due to a fixed radius. Built with D3 v6, the code loads CSV data via `d3.csv`, uses `scaleLinear` and `extent` for scales, and renders axes with `axisLeft` and `axisBottom`. All elements are drawn as SVG circles appended to the body.

AI-generated description

A vanilla HTML implementation of a D3 scatter plot. Shows the Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris Dataset, mapping petal length and width along the x- and y-axes while coloring each point by species. It also encodes sepal length and width into the horizontal and vertical radii of each circle, creating an elongated marker shape. The code loads data from a CSV using `d3.csv`, applies `d3.scaleLinear` and `d3.extent` for scales, and renders circles with SVG attributes `cx`, `cy`, `r`, `rx`, and `ry`. Axes are drawn with `d3.axisLeft` and `d3.axisBottom`, and the visualization fills the browser window.

Vvidhyanamini
95% match
Loading thumbnail…

Iris Dataset Scatter Plot

This example visualizes the Iris dataset as a scatter plot, mapping petal length on the x-axis and petal width on the y-axis, with points colored by species (setosa, versicolor, and virginica). Each circle’s radius is fixed, while its horizontal and vertical offsets correspond to the raw sepal measurements via the `rx` and `ry` attributes. The SVG renders using D3 v6, with `scaleLinear` and `extent` for scaling, `axisLeft` and `axisBottom` for axes, and `csv` to load the external data file.

SsatishbabuNalajala
95% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes the Iris Dataset, mapping petal length on the x-axis against sepal length on the y-axis, with points colored by species (setosa, versicolor, and virginica). Built with D3 v6 and rendered as SVG, it uses `d3.csv` to load data, `scaleLinear` and `extent` to set scales, and `axisLeft` and `axisBottom` for axes. Circle marks are appended via `data().join()`, with a custom color mapping function for each species. The plot fills the browser window and includes labeled axes.

KK V VINITHA
94% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris Dataset, mapping petal length and width to the x- and y-axes, with each point colored by species (setosa in blue, versicolor in red, and virginica in black). The code uses D3 v6’s `d3.csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load data from a remote CSV, build linear scales, render axes, and draw circles via SVG. The plot fills the browser window, and points are fixed at a radius of 5 pixels, while sepal measurements are stored but not visually encoded.

SSumanya4
94% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris Dataset, mapping petal length and width to the x- and y-axes, with each point colored by species (setosa in blue, versicolor in red, and virginica in black). The code uses D3 v6’s `d3.csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load data from a remote CSV, build linear scales, render axes, and draw circles via SVG. The plot fills the browser window, and points are fixed at a radius of 5 pixels, while sepal measurements are stored but not visually encoded.

SSumanya4
94% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and petal width on the y-axis, with each point colored by species (setosa, versicolor, or virginica). The plot also encodes sepal length and width as additional attributes on each circle, though these do not affect the visual radius. Built with D3 v6, the code uses `d3.csv` to load data, `d3.scaleLinear` and `d3.extent` for scaling, and `d3.axisLeft` and `d3.axisBottom` to render axes. The SVG circles are created via `selectAll('circle').data(marks).join('circle')`, with static labels for both axes.

Ppreethamkesa
94% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris Dataset, mapping petal length and width for each sample while coloring points by species (setosa, versicolor, virginica). It uses D3 v6’s `csv` loader, `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` to render an SVG chart. Circle marks encode petal measurements, while sepal length and width are stored as unused `rx`/`ry` attributes. The axes are labeled with rotating text, and the visualization fills the browser window, with the data fetched from a GitHub-hosted CSV file.

Bbhargavarathod
94% match
Loading thumbnail…

scatter plot

This D3 scatter plot displays the Iris Dataset, using petal length and width for the x- and y-axes while encoding species membership through circle colors (green, yellow, and black). It also maps sepal measurements to each point’s `rx` and `ry` attributes, though these elliptical properties are overridden by a fixed radius. Data loads via `d3.csv` and parses numeric columns. Axes are rendered with `d3.axisLeft` and `d3.axisBottom`, while scales use `d3.scaleLinear` and domains derive from `d3.extent`. SVG rendering creates responsive, full-viewport visuals with rotated axis labels.

Eeravellisaimeghana
94% match