Skip to main content
SimilarExport ZIP
100%

Abalone Correlation Matrices

✓ Published0🌍 Public
JJames Huang
Last edited Oct 8, 2023
Created on Oct 4, 2023
Forked from HTML Starter

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.

AI-generated description

HW3_Correlation Matrix

MIT Licensed

Similar vizzes

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
94% match
Loading thumbnail…

Abalone Correlation Matrix

This visualization shows the correlation matrix for physical measurements of abalones, comparing length, diameter, height, various weights, and rings (age). Each cell is colored according to the strength of correlation, revealing strong relationships among size and weight variables and weaker correlations with age. The code uses D3 v4’s scale functions and SVG rendering to draw a grid of colored rectangles. Precomputed correlation values for both female and male abalones are embedded as data arrays, with axis labels placed along the top and left edges for each variable.

黃黃歆善
91% match
Loading thumbnail…

Correlation Matrix

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.

方方顗棠
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
90% match
Loading thumbnail…

HW3-Abalone Correlation Matrix

This visualization shows the correlation matrix for the Abalone dataset, split into three separate views by gender (Male, Female, Infant) via a dropdown selector. It displays the pairwise Pearson correlations between eight physical measurements (length, diameter, height, weight variables, and rings). Each cell is colored using a chroma color scale from red through white to steelblue, with values ranging from -1 to the maximum correlation. The tooltip on hover reveals the exact correlation value. Built with D3.js, the code utilizes `jz.arr.correlationMatrix` for calculations and `data2grid.grid` for layout.

Yyuting89830@gmail.com
88% match
Loading thumbnail…

Fork of Correlation Matrix

This visualization shows a correlation matrix of abalone physical measurements, with cells colored by Pearson correlation coefficients. A dropdown menu filters the matrix to display correlations for male, female, or infant abalones from the `abalone.data` dataset. The matrix uses `d3.scaleBand` for axes, `d3.scaleSequential` with `interpolateRdYlBu` for color encoding, and displays correlation values as text labels. Animations transition cells between states using `transition.attr`, with axes rendered via `d3.axisLeft` and `d3.axisBottom`.

Hhi4u2qzy@gmail.com
87% match
Loading thumbnail…

Fork of Correlation Matrix

Three side-by-side correlation matrices visualize relationships among physical measurements of abalone from the `abalone.csv` dataset. Each matrix combines numeric correlations in its lower-left triangle with scaled circles in the upper-right, using a diverging color scale from `chroma.scale` (or a D3 linear scale) to encode strength and direction. The code builds the matrices with `d3.scalePoint` for axes, `d3.axisTop` and `d3.axisLeft` for labels, and `d3.csv` to load data. Hover interactions highlight cells and show exact correlation values via a tooltip.

Pplchao
87% match
Loading thumbnail…

Data Visualization Homework 3: Correlation Matrix

This visualization shows a 3x3 grid of correlation matrices for male, female, and infant abalone, using data from the abalone.data file. Each matrix displays the pairwise correlations between eight physical attributes (Length, Diameter, Height, various weights, and Rings) as colored squares with numerical labels. The code uses D3 v5 to render SVG elements, with scales from `scaleBand` and `scaleLinear` for positioning and color encoding. Correlation calculations are performed using the `jz.arr.correlationMatrix` utility from the jeezy library, while the `data2grid` library reshapes the data for grid-based rendering.

Dderrick373519@gmail.com
86% match