Scatter Plot

100%

✓ Published0🌍 Public

Last edited Oct 19, 2025

Created on Oct 19, 2025

Forked from Fork of Fork of HTML Starter

This scatter plot visualizes the Iris flower dataset, mapping petal length on the x-axis against sepal length on the y-axis. Each circle represents a single flower sample, with axes and labeled ticks generated using d3.axisBottom and d3.axisLeft. The code loads CSV data via d3.csv, scales positions with d3.scaleLinear and d3.extent, and renders the chart as SVG elements. Axis labels are manually added as SVG text, with the visualization filling the entire browser viewport.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Iris Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length on the x-axis against sepal length on the y-axis for each flower sample. The code loads the CSV data using d3.csv, parses numeric fields, and scales the values with d3.scaleLinear and d3.extent. Circles mark each data point in an SVG rendered at full viewport size. Axes are added with d3.axisLeft and d3.axisBottom, while custom text labels for "Petal Length" and "Sepal Length" are positioned using SVG transforms. The example uses D3 v6 and a margin-based layout for the plot.

LLakshmiVandanaNunna

96% match

Loading thumbnail…

D3 Scatter Plot

This D3 scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and sepal length on the y-axis. The SVG rendering uses d3.scaleLinear to transform raw CSV values into pixel coordinates, with d3.min and d3.max defining the domains. Circles represent individual flowers, colored in a teal tone, while d3.axisLeft and d3.axisBottom generate labeled axes. The code loads data via d3.csv and appends text labels for both axes, using a full-window responsive layout with fixed margins.

Aainhoadieruiz@gmail.com

96% 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. Using D3 v7, it loads CSV data via `d3.csv`, applies linear scales with `scaleLinear`, and renders circles as marks. Axes are drawn with `axisLeft` and `axisBottom`, and the SVG canvas fills the browser window. The code explicitly parses numeric fields and converts data values into pixel coordinates for each point.

SScott-Collier

95% match

Loading thumbnail…

Scatter Plot

A D3 scatter plot displays the Iris dataset, mapping petal length to the x-axis and sepal length to the y-axis using linear scales and axis generators. Each flower is rendered as a circle with a fixed radius of five pixels. The visualization fills the browser window by sizing the SVG to the viewport dimensions. It loads CSV data with `d3.csv`, parses numeric fields, and uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to construct the plot.

RRupeshGandham

95% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the Iris Dataset, comparing petal length against sepal length for individual flowers. Built with D3 v6, the SVG rendering uses `scaleLinear` to map data extents to pixel coordinates, with `axisLeft` and `axisBottom` generating labeled axes. Circles are joined to the data via `selectAll().data().join()`, while margins and full-window dimensions position the chart. The code asynchronously loads the comma-separated values using `csv` and parses numeric fields before plotting.

Vvidhyanamini

95% match

Loading thumbnail…

D3 Scatter Plot

This D3 scatter plot visualizes the Iris Dataset, mapping petal length on the x-axis against sepal length on the y-axis. Each flower is represented by a circle, with scales derived from the data’s extent using d3.scaleLinear. The SVG rendering uses d3.select and .join() to create the circles, while d3.axisLeft and d3.axisBottom generate the labeled axes. Data is loaded asynchronously via d3.csv, and the plot fills the browser window, with margins and a fixed radius applied to all points.

DDINESH SAI BOPPANA

95% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and sepal length on the y-axis. Using d3.scaleLinear and d3.extent to compute domains, it positions circles in an SVG via d3.select, data joins, and the join() method. Axes are rendered with d3.axisLeft and d3.axisBottom, while the CSV is loaded and parsed with d3.csv, converting string values to numbers. The plot updates to fill the browser window.

AArturo Guevara

95% match

Loading thumbnail…

scatter plot

This scatter plot visualizes the Iris dataset, mapping petal length to the x-axis and sepal length to the y-axis. Each flower is rendered as a circle using D3 v7’s `select`, `scaleLinear`, `csv`, and `extent` functions, with axes drawn via `axisLeft` and `axisBottom`. The SVG output fills the browser window, with data loaded from a remote CSV file and parsed into numeric fields before plotting.

Ddwikbtn

94% match