109550187_HW3

100%

✓ Published0🌍 Public

Last edited Oct 9, 2023

Created on Oct 2, 2023

Forked from Percent Bee Colony Loss by State and Year

This visualization displays three correlation matrices for subsets of the Abalone dataset, showing the pairwise relationships between nine physical measurements. Each matrix uses diverging colors from blue through yellow to red to represent correlations from -1 to 1, with numeric values overlaid on each cell. A fourth SVG shows the corresponding color legend. The matrices are rendered as SVG using D3 v5 scales and the `jz.arr.correlationMatrix` API from the jeezy library, with interactive hover effects that display detailed correlation information in text below. The data is loaded asynchronously from a remote CSV file.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

hw3

This visualization displays a correlation matrix for the Abalone dataset, using three side-by-side heatmaps to compare different variable groupings. Hovering over a cell highlights it and displays the exact correlation value in the text area below. The implementation uses D3.js scales for color and positioning, `jz.arr.correlationMatrix` for computing correlations, and renders the matrix with SVG rectangles and circles, where the upper triangle uses colored circles to represent correlation strength.

Ccpsu00

89% match

Loading thumbnail…

hw3

This visualization displays a correlation matrix for the Abalone dataset, split into three separate heatmaps for the male, female, and infant abalone subsets. Each cell shows the correlation coefficient between two attributes, color-coded from red (negative) to blue (positive), with the numeric value overlaid. Hovering over a cell highlights it and displays the specific attribute pair in the text area below. The code uses D3 v5 with SVG rendering, leveraging `d3.scaleLinear` for color mapping and the `jz.arr.correlationMatrix` function from the jeezy library to compute correlations. The data is loaded from the `abalone.data` file.

Nnanegole

88% match

Loading thumbnail…

hw3_submit

This visualization displays a correlation matrix for the abalone dataset, using color and text to show correlations between numerical attributes like Length, Diameter, and various weight measurements. A color legend with a diverging scale from pink to steel blue accompanies the matrix. The visualization uses D3 v5 and the jeezy library's `arr.correlationMatrix` API to compute correlations, rendering the matrix with SVG elements and adding a dropdown menu to filter data by sex.

Ddaniel

87% match

Loading thumbnail…

109705001_hw3

Three side-by-side correlation matrix heatmaps visualize the Abalone dataset, split by sex (M, F, I), with each cell colored by Pearson correlation strength using a diverging scale. Hovering a cell outlines it in red and displays the compared variables and correlation value in a text panel below. The visualization uses D3 v5 with SVG rendering, the `jz.arr.correlationMatrix` utility from the jeezy library for computations, and a custom color legend derived from a linear scale.

Yyihsuan

87% match

Loading thumbnail…

hw3

This visualization shows a correlation matrix for abalone measurements, split by sex (male, female, or infant) via clickable buttons. The upper triangle displays correlation coefficients as colored text, while the lower triangle uses scaled circles, with diagonal labels identifying each variable. The code uses d3.csvParse, d3.scalePoint, d3.scaleSqrt, and d3.scaleLinear, along with the jeezy library’s jz.arr.correlationMatrix to compute correlations. Data is loaded asynchronously via d3.text from a remote CSV, and the SVG is rendered in React with Bootstrap-styled controls.

Kkenny-wq

87% 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

86% 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

86% 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

85% match