Skip to main content
SimilarExport ZIP
100%

D3 Scatterplot with Regression Line

✓ Published0🌍 Public
RRenonDis
Last edited Jan 26, 2018
Created on Jan 26, 2018

This scatterplot displays the classic Iris dataset, plotting sepal length against sepal width for three species. Each species is represented by a distinct symbol and color: circles for virginica, triangles for setosa, and squares for versicolor. The code computes a linear regression directly from the data and overlays the resulting regression line in green. It uses D3.js version 3.5.6 with SVG rendering, including `d3.svg.axis` for the axes and `d3.svg.symbol` for the custom point shapes.

AI-generated description

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/anonymous/'>anonymous</a>'s block: <a href='http://bl.ocks.org/anonymous/0c822a3667fcb53af47e5701c8f84644'>fresh block</a>

mit Licensed

Similar vizzes

Loading thumbnail…

D3 Scatterplot with Regression Line

This example visualizes the classic Iris dataset, plotting sepal length against petal length for three flower species—setosa, versicolor, and virginica—as colored circles in a D3 scatterplot. Each species has its own linear regression line, computed from the data and drawn as a path, with the lines in blue, red, and green to match the points. The visualization uses D3’s `d3.svg.axis` for axes, `d3.scale.linear` for positioning, and `d3.svg.line` to generate the regression curves, all rendered as SVG elements. The data is embedded directly in the script via a `create_data()` function, and the axes are labeled with the raw measurement units from the dataset.

4456lumen
94% match
Loading thumbnail…

D3: Drawing with iris data

This example visualizes the classic Iris dataset as a scatter plot, showing sepal length against sepal width. Each data point is rendered as a distinct SVG symbol (triangle, cross, or star) and color-coded by species: red for setosa, orange for virginica, and blue for versicolor. The visualization also includes linear regression lines for each species, calculated using a custom `leastSquaresequation` function, to highlight trends within the groups. Built with D3 v4, the code uses `d3.scaleLinear`, `d3.symbol`, and `d3.axisBottom`/`d3.axisLeft` to construct axes and symbols, with data loaded from an external CSV file.

MMathReynaud
90% match
Loading thumbnail…

D3: Drawing with iris data

This example visualizes the classic Iris dataset by plotting sepal length against sepal width for three species of iris flowers. Each species is distinguished by a unique symbol shape and color: red triangles for setosa, orange crosses for virginica, and blue stars for versicolor. The visualization also overlays a least-squares regression line for each species, computed from the data, to show trends in the relationship. Built with D3 v4, the code loads the CSV data and uses `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.symbol` to render the SVG scatterplot and its axes.

MMathReynaud
89% match
Loading thumbnail…

D3: Drawing with iris data

This example visualizes the classic Iris dataset by plotting sepal length against sepal width for three species of iris flowers. Each species is distinguished by a unique symbol shape and color: red triangles for setosa, orange crosses for virginica, and blue stars for versicolor. The visualization also overlays a least-squares regression line for each species, computed from the data, to show trends in the relationship. Built with D3 v4, the code loads the CSV data and uses `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.symbol` to render the SVG scatterplot and its axes.

MMathReynaud
89% match
Loading thumbnail…

Iris_scatterplot_sepal

This example visualizes the classic Iris dataset, plotting sepal length against sepal width for three iris species. Built with D3 v4, the scatterplot uses SVG shapes to encode species: circles for setosa, red squares for versicolor, and black squares for virginica. A square-root scale controls point size, and hover tooltips display species names. Animated transitions and a categorical color legend complete the chart, which reads directly from iris.csv.

DDjokovalle
88% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes the Iris dataset, showing the relationship between sepal and petal measurements. Points are colored by species—setosa in dark red, versicolor in dark blue, and virginica in light green—mapping petal length and width to x and y positions. The code loads data via `d3.csv`, applies scales with `d3.scaleLinear` and `d3.extent`, and renders SVG circles with `d3.select` and `.join`. Axis labels and ticks are added using `d3.axisLeft` and `d3.axisBottom`, with the plot sized to the full window.

Vvarun-030
88% match
Loading thumbnail…

Scatter plot iris

This example visualizes the classic Iris dataset as a scatter plot, showing the relationship between sepal width and sepal length across three flower species. Each species is represented by a colored square marker, with a legend in the top-right corner identifying the color mapping. The visualization uses D3.js v3 with SVG rendering, employing `d3.scale.linear` for the axes, `d3.svg.axis` for tick marks, and `d3.scale.category10` for the categorical color scheme on data loaded from a CSV file.

RRemiFaure
88% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes the classic Iris dataset, displaying sepal length against sepal width for three species of iris flowers. Each point represents a sample, color-coded by species (setosa, versicolor, virginica) using blue, green, and orange, and includes interactive tooltips that reveal exact measurements on hover. The visualization is built with D3.js v7, using `d3.csv` to load the local CSV data, `d3.scaleOrdinal` for color mapping, and `d3.scaleLinear` to map data to pixel coordinates. The SVG rendering includes labeled axes, a legend, and smooth tooltip transitions for enhanced readability.

LLikhitaMudagereShivaraj@my.unt.edu
88% match