Skip to main content
SimilarExport ZIP
100%

Iris Dataset Scatter Plot by Tejaswi_Tummala

✓ Published0🌍 Public
Tttummala17
Last edited Jun 25, 2022
Created on Jun 25, 2022
Forked from HTML Starter

This example visualizes the Iris dataset as a scatter plot, mapping petal length along the x-axis and sepal length along the y-axis. Each circle represents one flower, with no color or categorical encoding. The code loads data via `d3.csv` from a remote GitHub gist, parses numeric fields, and uses `d3.scaleLinear` with `d3.extent` to set the domains. Axes are rendered using `d3.axisLeft` and `d3.axisBottom`, and the plot is drawn as SVG circles with a fixed radius within a full-window viewport.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris dataset, plotting petal length against sepal length for three iris species, each encoded with a distinct color. The visualization is rendered as an SVG using React and D3 v6. It loads the data from a CSV file with d3.csv, parses numeric fields, and applies d3.scaleLinear for the x and y axes, with d3.axisLeft and d3.axisBottom for ticks. Circles are created with D3’s data join, and the chart fills the full window size.

TTejaswi@3271
93% match
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
92% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the relationship between petal length and sepal length for Iris flower species, with each point colored by species (setosa, versicolor, virginica). The code loads data from a GitHub gist CSV file using d3.csv, then applies d3.scaleLinear and extent to map the values to screen coordinates. Axes are rendered with d3.axisLeft and d3.axisBottom, while circles are drawn as SVG elements with custom color encoding. The example demonstrates D3 v6 usage, including margin conventions, width/height from window dimensions, and labeled chart annotations.

TTejaswi@3271
92% 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
91% match
Loading thumbnail…

Iris Dataset Scatter Plot

This example visualizes the Iris Dataset as a scatter plot, mapping petal length to the x-axis and petal width to the y-axis, with each point colored by species (blue for setosa, red for versicolor, black for virginica). The code uses D3 v6, loading CSV data via `d3.csv`, scaling with `scaleLinear`, and rendering SVG circles with `selectAll` and `join`. It also draws labeled x- and y-axes using `axisBottom` and `axisLeft`, while the plot’s dimensions adapt to the browser window.

KKolliTeja
91% match
Loading thumbnail…

Iris Dataset Scatter Plot

This D3.js scatter plot visualizes the Iris Dataset, mapping petal length on the x-axis against sepal length on the y-axis. Each point represents an iris flower, colored by species (setosa in chartreuse, versicolor in orange, and virginica in blue). The code loads data from a CSV file via `d3.csv`, uses `scaleLinear` for axes, and renders circles as SVG elements. Axes are generated with `axisLeft` and `axisBottom`, while text labels for the axes are appended separately.

VVaishnavi6199
91% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length and petal width to x and y axes while coloring each point by species (setosa, versicolor, or virginica). The visualization uses D3 v6’s `scaleLinear`, `extent`, `axisBottom`, and `axisLeft` to construct the chart, with circles rendered as SVG elements. Data is loaded via `d3.csv` from a GitHub gist, and radii are set to a constant value despite additional sepal measurements being parsed. Axis labels appear rotated for the y-axis, and the full window dimensions define the SVG canvas.

Ssaijahnaviappineni
91% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris dataset, plotting petal length against petal width for individual flowers, with points colored by species (brown for setosa, orange for versicolor, red for virginica). The visualization uses D3.js v6, employing `scaleLinear` and `extent` to map data ranges to screen coordinates, and renders circles as SVG marks via `selectAll` and `join`. Axes are generated with `axisLeft` and `axisBottom`, while the data is loaded asynchronously from a CSV URL using D3’s `csv` function.

SSyed Araib Karim
91% match