Fork of test

100%

✓ Published0🌍 Public

Last edited Oct 5, 2023

Created on Oct 4, 2023

Forked from test

This example displays a correlation matrix for the mtcars dataset, with each cell showing the correlation coefficient between two variables, either as a numerically labeled square or a colored circle. The color scale encodes the strength and direction of correlation, ranging from red for negative through white for zero to dark blue for positive values. The visualization uses D3.js version 3 with an ordinal scale for positioning and a linear color scale, rendering as SVG. A vertical color legend with axis is included on the right side.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of test

This visualization displays a correlation matrix for the `mtcars` dataset, showing pairwise relationships between variables. The upper triangle presents correlation coefficients as colored text, while the lower triangle uses circles sized by the absolute correlation value, with color indicating the correlation strength from red (negative) to blue (positive). The diagonal labels each variable. Built with d3.v3, the code loads data from CSV, uses ordinal scales with `rangePoints` for positioning, and applies a linear color scale for the diverging color scheme.

Nnandugali

92% match

Loading thumbnail…

test

This example shows a correlation matrix for the mtcars dataset, displaying pairwise Pearson correlation coefficients between variables as both numeric values and colored circles. Negative correlations appear in red, positive correlations in blue, and the diagonal labels each variable. The visualization is rendered as an SVG using D3 v3, with a diverging color scale mapping values from -1 to 1. A legend on the right shows the color gradient. The data is loaded from a CSV file using `d3.csv`.

Ddaniel

91% match

Loading thumbnail…

colour Scale test

This example displays a correlation matrix as a square grid of colored cells, using a diverging red-white-navy color scale to represent values from -1 to 1. The dataset is a correlation matrix of automobile metrics (from the classic `mtcars` data), with each cell showing a correlation coefficient or variable name. The lower triangle uses text values, while the upper triangle renders circles whose radius scales with the absolute correlation. Built with D3 v3 and SVG, it includes a custom color legend axis generated with `d3.svg.axis` and a series of colored rectangles.

DDonald Bagwell

86% match

Loading thumbnail…

Correlation Matrix

This visualization displays a correlation matrix for 26 randomly generated variables, where each cell’s color indicates the correlation strength between two variables. The data is synthesized with random numbers, and the matrix reveals that most correlations are near zero, with only the diagonal showing perfect correlation. The implementation computes correlations using jeezy's `correlationMatrix` function, arranges the cells with data2grid, and maps colors with a chroma scale from tomato through white to steelblue. D3 v4 renders the SVG grid, while hover interactions highlight corresponding rows, columns, and a tooltip showing the exact correlation value.

663anp3ca

76% match

Loading thumbnail…

Correlation Matrix

This correlation matrix visualizes the relationships between 26 random variables (columns a–z) across 31 data points, using a color scale from tomato to steelblue to represent correlation strength, ignoring perfect self-correlations. Built with D3 v4 and the jeezy and data2grid libraries, the grid renders as an SVG with smooth opacity transitions. Users can hover over any cell to see the exact correlation value in a tooltip, while the corresponding row and column labels highlight in bold green to clarify the pair. The axes display the variable names along both dimensions, and the color scale uses a diverging white midpoint to emphasize positive versus negative correlations.

663anp3ca

75% match

Loading thumbnail…

Correlation Matrix

This visualization displays a correlation matrix for 26 randomly generated variables (columns a through z), with each cell’s color indicating the correlation strength between variable pairs. The heatmap uses a red-white-blue color scale, and hovering over a cell highlights the corresponding row and column labels while showing the exact correlation value in a tooltip. The example computes the correlation matrix with jeezy's correlationMatrix function, arranges the cells using data2grid, and renders them as SVG rectangles with d3.v4. Chroma.js generates the color scale, and the visualization includes animated opacity transitions and interactive hover effects.

AAlainRo

74% match

Loading thumbnail…

Fork of test

This bubble chart visualizes the correlation between average horsepower, torque, and highway MPG for various car makes. Each circle’s position encodes horsepower (x-axis) and torque (y-axis), while its size represents highway MPG and its color distinguishes the car brand. The visualization uses D3 v7 with SVG, rendering static bubbles that reveal a tooltip showing the car make on hover. Data is loaded from a CSV file and styled via inline attributes and CSS.

MMalempatiSaranya

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

72% match