Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

CS 360 Assignment 7 - Adjacency Matrix in d3

Public visualization

CS 360 Assignment 7 - Adjacency Matrix in d3

0 stars0🌍 Public
SSean Sanchez
Last edited Apr 2, 2022
Created on Mar 29, 2022
Forked from HTML Starter

This example visualizes the Zachary Karate Club dataset as an adjacency matrix, displaying the 34 members and their 78 connections. Each cell represents a potential edge between two nodes, with fill opacity proportional to edge weight. The visualization uses d3.v3’s `d3.svg.axis` for ordinal axes and SVG `rect` elements for matrix cells. Data loading uses `d3.csv` with a `queue()` helper to parse node and edge lists from separate CSV files. Interactive highlighting is implemented through `mouseover` events that emphasize entire rows and columns.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

original dataset found here

https://networkrepository.com/soc-karate.php

code for network loading/data parsing and matrix generation sourced from these examples below

https://bl.ocks.org/harrisoncramer/32bbcd8c360e6d8aa0d5b7a50725fe73

http://bl.ocks.org/emeeks/9441864

Comments

Sign in to join the discussion.

MIT Licensed