Skip to main content
SimilarExport ZIP
100%

312553048_HW3

✓ Published1🌍 Public
Jjerry70938@gmail.com
Last edited Sep 25, 2024
Created on Sep 23, 2024
Forked from Iris_312553048_HW1

This example shows a correlation matrix for abalone physical measurements, split by sex (Male, Female, or Infant). The upper triangle uses a red-blue color scale to encode correlation strength, while the lower triangle displays the numeric correlation values. A dropdown menu filters the matrix by sex category. The visualization is built with D3 v6, using `scaleBand` for axes, `scaleSequential` with `interpolateRdBu` for colors, and computes Pearson correlations from CSV data parsed with `d3.csvParseRows`.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

0927

This visualization displays a correlation matrix for physical measurements of abalone, filtered by sex using buttons for Female, Male, and Infant. The matrix uses a color scale from white to a sex-specific hue to encode Pearson correlation coefficients between eight attributes, including length, weights, and rings. The example loads data from a CSV file, filters rows by the selected sex, computes correlations with d3 functions, and renders the grid as SVG rectangles using d3.v7.

Eeyxxr1260@gmail.com
90% match
Loading thumbnail…

HW3_311553050

This example shows a correlation matrix for abalone measurements, with eight variables (v1–v8) displayed as a triangular grid of colored cells. A dropdown menu lets the viewer switch between male, female, and infant subsets of the data. Each cell is filled using a red-white-steelblue chroma.scale diverging palette centered on the average correlation, with the correlation value printed inside. The visualization uses d3.scaleBand for axes, d3.axisTop and d3.axisLeft for labels, and transitions to fade in the SVG rectangles, with a gradient legend rendered below.

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

0927

This visualization displays three correlation matrices for male, female, and infant abalones, using the abalone.csv dataset. Each matrix shows pairwise correlations between physical measurements and rings (age), with colors ranging from blue (negative correlation) to red (positive correlation). The code uses d3.v6 with `d3.scaleBand`, `d3.scaleSequential`, and `d3.interpolateRdBu` to render the SVG cells, and includes interactive tooltips on mouseover. The three matrices appear side-by-side, allowing comparison of correlation patterns across sex categories.

Eeyxxr1260@gmail.com
88% 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
88% 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
88% 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.

方方顗棠
88% match