Correlation Matrix

100%

Correlation Matrix

✓ Published0🌍 Public

Last edited Oct 11, 2023

Created on Oct 11, 2023

The correlation matrix visualizes relationships among eight physical measurements of abalone, split into three separate panels for male, female, and infant groups. Each panel uses color-coded text for correlation coefficients above the diagonal and proportional circles below it, with black labels on the diagonal. The code loads data from `abalone.csv`, computes correlations with the `jz.arr.correlationMatrix` utility, and renders SVG elements using `d3.scaleLinear`, `d3.scalePoint`, and `d3.scaleSqrt`. Distinct color ranges per sex highlight varying correlation strengths across the groups.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Correlation-matrix Abalone 1 no tooltip

Three side-by-side correlation matrices visualize relationships among eight physical measurements of abalone, split by sex into male, female, and infant groups. Each grid cell is colored with a sequential rainbow scale from −1 to 1, revealing how measurement correlations differ across the three categories. The code uses `d3.scaleBand` for axes, `d3.scaleSequential` with `d3.interpolateRainbow` for color, and `jz.arr.correlationMatrix` plus `data2grid.grid` to compute and arrange the correlations. Data comes from a CSV file of abalone measurements rendered as SVG rects.

Wweird_danger

92% match

Loading thumbnail…

Fork of Correlation-matrix Abalone 1 no tooltip

Three side-by-side correlation matrices show how eight physical measurements of abalone—length, diameter, height, weights, shell weight, and rings—relate for male, female, and infant subgroups. Each matrix displays Pearson correlation coefficients for every pair of variables, encoded as rainbow-colored cells from -1 to 1. The visualization uses the `data2grid` library to arrange the cells and `d3.scaleSequential` with `d3.interpolateRainbow` for coloring, while `d3.scaleBand` positions the axes. The code filters the `data.csv` source by sex and renders separate SVG matrices for each category, with axis labels rotated for readability.

SSharon Lin

91% match

Loading thumbnail…

Abalone Correlation Matrices

Three correlation matrices compare eight physical measurements of abalone—Length, Diameter, Height, various weights, and Rings—separated by sex (male, female, infant). Each matrix cell displays the sample correlation coefficient, colored on a blue-red diverging scale from −1 to 1. The visualization loads a CSV dataset via `d3.csv`, computes correlations with `ss.sampleCorrelation` from simple-statistics, and renders SVG rectangles and text labels using D3 v7.

JJames Huang

91% match

Loading thumbnail…

Abalone Correlation Matrices

This example shows three correlation matrices for male, female, and infant abalones, using a diverging red-blue color scale to represent the strength and direction of correlations between eight physical attributes. The matrices display numerical correlation values in each cell, with negative correlations in red and positive in blue. The code loads abalone data from a CSV file, filters it by sex, and calculates correlations using the simple-statistics library’s `sampleCorrelation` function. Each matrix is rendered as an SVG using D3 v7, with `d3.scaleSequential` and `d3.interpolateRdBu` defining the color mapping, and axis labels positioned around the grid.

JJames Huang

91% match

Loading thumbnail…

Correlation Matrix

This interactive correlation matrix visualizes relationships among eight physical measurements of male abalone from the abalone.csv dataset. The code uses D3 v4/v5 to render an SVG grid, where each cell’s color—scaled via chroma-js from tomato to steelblue—represents the correlation strength between variable pairs. A hover interaction highlights selected cells and displays a tooltip. The visualization is built with D3’s scaleBand for axes and data2grid to structure the correlation matrix data.

Cchingching17

91% match

Loading thumbnail…

Correlation Matrix

This visualization presents a correlation matrix for the Abalone dataset, split into three separate SVG grids for male, female, and infant samples. Each cell color encodes the correlation coefficient between two variables, using a red-to-white-to-steelblue Chroma.js scale. Hovering over a cell highlights the corresponding row and column axis labels and displays the exact correlation value in a tooltip. The implementation uses D3 v4 scales and axes, the `jz.arr.correlationMatrix` function from the jeezy library for computation, and `data2grid` for grid layout.

LLSAWB

90% match

Loading thumbnail…

Correlation matrix FINAL！！！

This visualization presents three correlation matrices for abalone measurements, split by sex (male, female, and infant), with each cell colored by Pearson correlation using a rainbow scale from -1 to 1. The D3.js v4 code computes correlations via `jz.arr.correlationMatrix` and renders the grid with `data2grid`, while axis labels are rotated, and hovering over a cell highlights the corresponding row and column labels with a tooltip. The underlying dataset is loaded from a CSV file, and the SVG output is styled with CSS for selected states and interactive feedback.

Wweird_danger

90% match

Loading thumbnail…

0924

Three side-by-side correlation matrices visualize the relationships among eight physical measurements of abalone, split by sex (male, female, infant). Each cell’s color encodes the Pearson correlation coefficient between two attributes, using a red-blue diverging scale. Computed from the `abalone.csv` dataset, the matrices are rendered as SVG using D3 v6, with d3.mean, d3.sum, and custom functions calculating correlations. Interactive tooltips reveal exact correlation values on hover.

Eeyxxr1260@gmail.com

90% match