Skip to main content
SimilarExport ZIP
100%

Charan - Scatter Plot using Iris dataset

✓ Published1🌍 Public
Ccharanchand9
Last edited Jun 26, 2022
Created on Jun 26, 2022

This interactive scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and petal width on the y-axis, while coloring each point by iris species (setosa, versicolor, or virginica) with distinct colors (aqua, pink, and red). The visualization is rendered as an SVG using D3 v6, with axes labeled “Petal-length” and “Sepal-length.” It loads data via `d3.csv`, scales the coordinates with `scaleLinear` and `extent`, and draws the points with SVG `circle` elements, incorporating the raw sepal dimensions as unused `rx` and `ry` attributes. The chart fills the browser window, using margins for axis labels.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Charan - Scatter Plot using Iris dataset

This interactive scatter plot visualizes the Iris dataset, mapping petal length and petal width on the x- and y-axes while encoding species with distinct colors (aqua, pink, red) and using sepal dimensions to modulate marker size via the `rx` and `ry` attributes. Built with React and D3 v6, the example fetches CSV data from a remote gist, uses `scaleLinear` and `extent` to compute scales, and renders circles with SVG, adding styled axis labels and ticks via `axisBottom` and `axisLeft`.

Ccharanchand9
93% match
Loading thumbnail…

Fork of Fork of Charan - Scatter Plot using Iris dataset

This interactive scatter plot visualizes the Iris dataset, mapping petal length and width as x and y coordinates while encoding sepal length and width as elliptical radii. The visualization uses SVG circles with D3.js v6 scales, axes, and data joins to render the graph, with each species (setosa, versicolor, virginica) assigned a distinct color. The code loads CSV data, parses numeric fields, and positions marks using linear scales, while custom axis labels highlight the mapped variables.

Ccharanchand9
93% match
Loading thumbnail…

Data Visualization- Scatter Plot with Iris DataSet

This scatter plot visualizes the Iris dataset by 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 SVG rendering uses D3 v6 APIs including `d3.csv`, `d3.scaleLinear`, `d3.extent`, `d3.axisLeft`, and `d3.axisBottom` to load data, scale coordinates, and draw axes. Circles are created with `selectAll` and `join`. The code also references sepal measurements but visually applies them to the circle’s `rx` and `ry` attributes without visible effect. Data comes from a GitHub-hosted CSV file.

SSrilekha24
89% match
Loading thumbnail…

Iris Dataset Scatter Plot

This interactive scatter plot visualizes the Iris dataset, plotting petal length against petal width for individual flowers. Data points are color-coded by species—blue for setosa, red for versicolor, and black for virginica—allowing immediate comparison of species clusters. The visualization loads CSV data using d3.csv, and employs d3.scaleLinear and d3.extent to map the data to screen coordinates, with d3.axisLeft and d3.axisBottom rendering labeled axes. Circles are drawn as SVG elements with d3.selectAll and .join, while the chart also encodes sepal measurements as additional attributes (rx, ry) on each marker.

Ppravalliyaram
88% match
Loading thumbnail…

Scatter Plot with Iris DataSet

This scatter plot visualizes the Iris dataset, plotting petal length against petal width on the axes while coloring each point by species—setosa in pink, versicolor in blue, and virginica in red. The visualization uses D3 v6 (d3.scaleLinear, d3.extent, d3.axisLeft, d3.axisBottom) to render an SVG with circles whose radii are fixed but also encode sepal length and width via the `rx` and `ry` attributes. Data loads via `d3.csv` from a GitHub gist, and the chart fills the entire browser window.

SSumanya4
88% match
Loading thumbnail…

Scatter Plot with Iris DataSet

This scatter plot visualizes the Iris dataset, mapping petal length and width for individual flowers while coloring each point by species (setosa, versicolor, or virginica). It uses D3 v6 within a React-free HTML page, leveraging `d3.csv` for data loading, `scaleLinear` for axes, and `axisLeft`/`axisBottom` for ticks. Circles are rendered via SVG with a fixed radius, and the code also destructures sepal dimensions but only uses them as unused attributes on each circle, not for positioning. The visualization fills the browser window with a large bottom margin.

RRohith arabati
88% match
Loading thumbnail…

scatter plot

This scatter plot visualizes the Iris dataset, mapping petal length and width for individual flowers while coloring each point by species: red for setosa, green for versicolor, and purple for virginica. The code loads CSV data via D3’s `csv` function, parses numeric columns, and builds scales with `scaleLinear` and `extent`. Circles are rendered as SVG elements with fixed radius, while axes are generated using `axisLeft` and `axisBottom`. The visualization also encodes sepal measurements as `rx` and `ry` attributes, though these do not affect circle appearance given the constant radius. The chart fills the browser window with a pale turquoise title.

Vvagdevi-369
88% match
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
88% match