Scatterplot Matrix

100%

Scatterplot Matrix

✓ Published0🌍 Public

Last edited Jun 15, 2019

Created on Jul 31, 2012

A scatterplot matrix visualizes pairwise correlations across four measured traits of iris flowers, using Anderson’s dataset. Each cell displays a scatterplot with points colored by species, and diagonal cells label each trait. The code uses D3 v3 to build the matrix, applying linear scales (`d3.scale.linear`), SVG axes (`d3.svg.axis`), and SVG circles for data points. Data loads from a CSV file via `d3.csv`. The matrix layout is generated by computing the cross-product of traits with a custom `cross` function.

AI-generated description

The scatterplot matrix visualizations pairwise correlations for multi-dimensional data; each cell in the matrix is a scatterplot. This example uses Anderson's data of iris flowers on the Gaspé Peninsula. Scatterplot matrix design invented by J. A. Hartigan; see also R and GGobi. Data on Iris flowers collected by Edgar Anderson and published by Ronald Fisher.

Similar vizzes

Loading thumbnail…

Scatterplot Matrix

This scatterplot matrix visualizes pairwise correlations among four measurements of iris flowers, with each cell plotting one trait against another. The color of each point indicates the flower's species, derived from Anderson's classic dataset. The visualization uses the d3.v3 library, with SVG rendering. It constructs the matrix using d3.scale.linear for axes and d3.svg.axis for ticks, with d3.csv loading the data and d3.extent computing each trait's domain.

AAndresAnayaIsaza

92% match

Loading thumbnail…

Scatter Plot Matrix in D3

This scatter plot matrix displays pairwise relationships among four numeric Iris flower measurements, with points colored by species using a D3 ordinal scale. Each cell is an SVG chart rendered via `d3.axisLeft`, `d3.axisBottom`, and `d3.scaleLinear`, with diagonal cells labeling the corresponding dimension. The code loads Iris data from a GitHub Gist CSV, parses numeric fields, and iterates through all column combinations to generate a 4×4 grid of plots using `d3.csv` and `d3.select`.

EEunice Tu

86% match

Loading thumbnail…

Scatterplot Matrix Brushing d3v4

This example shows a scatterplot matrix of Anderson’s iris flower measurements, with four quantitative traits (sepal and petal length and width) plotted pairwise for 150 specimens, colored by species. Users can drag a rectangular brush on any cell to highlight matching points across all other plots, while unselected circles are dimmed. Built with D3 v4, it uses `d3.brush` for interactive selection, `d3.scaleLinear` and `d3.axisBottom`/`d3.axisLeft` for axes, and `d3.schemeCategory10` for colors. Data is loaded from a CSV file describing Edgar Anderson’s dataset, rendered as SVG circles.

PPhilippe Rivière

85% match

Loading thumbnail…

Scatterplot Matrix with D3

A scatterplot matrix displays pairwise relationships among four numeric measurements of iris flowers, with points colored by variety using a categorical color scale. Built with D3 v7 and SVG, the visualization renders a grid of small multiples, each pairing two variables on linear scales. The code constructs scales and axes from column metadata, uses `d3.cross` to generate cell positions, and applies `d3.InternSet` to filter data by variety. Labels appear along the diagonal, and the d3-legend library is linked but legend rendering is not implemented in the visible script.

OOlha

85% match

Loading thumbnail…

Fork of Fork of Scatter Plot

This visualization presents an iris dataset scatter plot matrix, with off-diagonal cells showing colored scatter plots of trait pairs and diagonal cells displaying histograms of individual traits. The scatter plots use colored circles to distinguish the three iris species. Built with D3 v4, the code employs `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, `d3.brush`, and `d3.histogram` to render the SVG-based matrix, with axes and frames styled via CSS.

Ddaniel

83% match

Loading thumbnail…

D3 Scatter Plot Matrix (still and proudly Vanilla JS 🙃)

A 4×4 scatter plot matrix compares every pair of numeric fields in the iris dataset, with circles colored by species using a d3.scaleOrdinal and the schemeSet1 color array. Each cell combines d3.axisLeft and d3.axisBottom for scales, while d3.csv loads the data from a Gist. The SVG charts are sized to a quarter of the window, and titles appear only on the diagonal cells. The code relies on vanilla JavaScript with d3 v6, using d3.select, d3.extent, and d3.scaleLinear per plot.

AAndrea Mignone

83% match

Loading thumbnail…

Iris_Scatter_Plot_Matrix

This interactive scatter plot matrix displays the four numeric attributes of the Iris dataset across a grid of pairwise scatter plots, with points colored by species (setosa, versicolor, virginica). The visualization uses D3.js v6 to create the SVG, with `d3.scaleLinear` for axes, `d3.scaleOrdinal` for categorical color mapping, and `d3.brush` to enable brushing—selecting points in one cell highlights the corresponding points across all other cells. Axis tick lines extend across the entire plot for readability, and species labels appear in the top-left area.

ZZeroKurosakii

82% match

Loading thumbnail…

Brushable Scatter Plot Matrix

A brushable scatter plot matrix displays pairwise relationships among four numeric iris flower measurements, with histograms along the diagonal showing each variable's distribution and points colored by species. The visualization is built using D3 v7, rendering SVG elements via `d3.csv` for data loading, `d3.scaleLinear` for axes, `d3.axisBottom` and `d3.axisLeft` for ticks, and `d3.histogram` for binning the diagonal distributions. Each off-diagonal cell encodes two variables as a scatterplot, while the color scale uses `d3.scaleOrdinal` with `d3.schemeCategory10` to distinguish Iris species.

Yyuting89830@gmail.com

81% match