Fork of D3 Scatter Plot

100%

Fork of D3 Scatter Plot

✓ Published0🌍 Public

Last edited Dec 6, 2023

Created on Dec 6, 2023

This fork of a D3 scatter plot visualizes the Iris Dataset, mapping petal length to the x-axis and sepal length to the y-axis. Each of the 150 flowers appears as a circle, with scales derived from the data’s extent and axes drawn using `axisLeft` and `axisBottom`. The code loads the CSV via `d3.csv`, parses numeric fields, and renders the SVG across the full viewport. It demonstrates a minimal, full-screen scatter plot with a custom tick font size, built using D3 v6.

AI-generated description

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

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of D3 Scatter Plot

This fork of a D3 scatter plot visualizes the Iris dataset, plotting petal length against sepal length. The visualization uses D3 v6 with SVG rendering, where each flower observation appears as a circle. The code loads the CSV data via `d3.csv`, scales the axes with `d3.scaleLinear`, and renders the plot using `d3.axisLeft` and `d3.axisBottom`. Circle positions are mapped through the linear scales, with margins and a fixed radius defining the layout across the full browser window.

Ppkalmane15

95% match

Loading thumbnail…

Fork of D3 Scatter Plot

This fork of a D3 scatter plot visualizes the Iris Dataset, mapping petal length on the x-axis and sepal length on the y-axis using d3.scaleLinear with nice tick values. It loads CSV data via d3.csv, parses numeric fields, and renders circles with SVG attributes set through d3.select and data joins. The visualization fills the browser window, adding an axisBottom and axisRight using d3.axisBottom and d3.axisRight, with a 24-pixel tick font size and fixed margins around the plot.

HHarshit-Prasad

95% match

Loading thumbnail…

Fork of D3 Scatter Plot

A D3 scatter plot displays the Iris dataset, mapping petal length on the x-axis and sepal length on the y-axis for individual flower specimens. Each data point is rendered as a fixed-radius SVG circle, with axes scaled using `d3.scaleLinear`. The code loads the CSV data via `d3.csv`, parses numeric fields, and appends an SVG canvas sized to the browser viewport. Axes are generated with `d3.axisLeft` and `d3.axisBottom`, while the circles are bound to data and added using `d3.selectAll` and `.join`.

NNita

95% match

Loading thumbnail…

Fork of D3 Scatter Plot

This fork of a D3 scatter plot visualizes the Iris Dataset, mapping petal length on the x-axis and sepal length on the y-axis. It loads CSV data from a Gist URL using `d3.csv` and renders circles as SVG marks. Axes are drawn with `d3.axisLeft` and `d3.axisBottom`, while `d3.scaleLinear` and `d3.extent` compute the scales. The chart fills the browser window, using `window.innerWidth` and `window.innerHeight` for its dimensions.

Ggalyniayaroshenko

95% match

Loading thumbnail…

Fork of D3 Scatter Plot

This fork of a D3 scatter plot visualizes the Iris dataset, plotting petal length on the x-axis against sepal length on the y-axis. Each flower observation appears as a circle, with scales computed from the data’s extent using `d3.scaleLinear` and `d3.extent`. The visualization loads CSV data via `d3.csv`, renders SVG circles with `selectAll` and `join`, and adds axes using `d3.axisLeft` and `d3.axisBottom`. The chart fills the browser window, with margins offsetting the axes and a fixed point radius of five pixels.

KKurt

95% match

Loading thumbnail…

Fork of D3 Scatter Plot

This scatter plot visualizes the Iris Dataset, plotting petal length against sepal length for individual flowers. The visualization is built with D3 version 6, using `scaleLinear` for both axes, `extent` to compute data domains, and `axisLeft`/`axisBottom` for tick marks. The code retrieves data from a CSV file via `d3.csv`, then renders circles with a fixed radius of 5 pixels. The SVG canvas fills the entire browser window, with axes labeled at 24-pixel font size.

NNaimisha-M

94% match

Loading thumbnail…

Fork of D3 Scatter Plot

This scatter plot visualizes the Iris Dataset, plotting petal length against sepal length for individual flowers. The visualization uses D3 v6 to load the CSV data, scale the x and y axes with `d3.scaleLinear`, and render circles as SVG marks. Axes are added using `d3.axisLeft` and `d3.axisBottom`, with the plot sized to the full browser window. The code demonstrates a clean mapping of data fields to spatial positions.

Zzhuomo-maker

94% match

Loading thumbnail…

Fork of D3 Scatter Plot

This example renders the Iris Dataset as a scatter plot, mapping petal length to the x-axis and sepal length to the y-axis. It uses D3 v6’s `csv` loader to fetch the data, `scaleLinear` with `extent` to compute scales, and `axisLeft`/`axisBottom` to draw the axes. The plot is drawn as SVG circles using `select` to append elements and a `join` operation for efficient circle creation. The visualization adapts to the full browser window, with tick labels styled at 24 pixels.

BBakunya | Kirisaki Rem

94% match