Skip to content

MustaphaU/Animated-Transition-Node_Link_and_Adjacency_Matrix

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Animated-Transition-Node_Link_and_Adjacency_Matrix

View the deployment here: https://mustaphau.github.io/Animated-Transition-Node_Link_and_Adjacency_Matrix/

Visualization Guide

Node-Link Diagram

  • Nodes represent groups or communities and are color-coded. (7 groups exist)
  • Hover over a node to enlarge and highlight its direct connections. This will also display the character name and description.
  • Click and drag nodes to reposition them. Other nodes will repel and move accordingly.
  • After initiating 'Start Transition', interactions are limited to hover details due to overlapping elements that disable other interactions like link highlighting and node dragging.

Adjacency Matrix

  • Matrix cells represent links between nodes.
  • Only cells for nodes that co-occurred are colored.
  • Hovering over colored cells will highlight the cell and its nodes.
  • You can sort the cells by label, cluster, or co-occurrence count.

Transition Notes

  1. You can toggle between the node-link and adjacency matrix views.
  2. If you re-order nodes in the matrix view, ensure you allow the reordering process to complete before switching back to the node view.
  3. Overlapping names in the matrix view can be resolved by completing the reordering process.

Untitled (1)