Choose from different graph data sets.
Adjust how nodes and edges are visualized.
Use node size to visualize the node degree.
Use node color to visualize the node degree.
Color Scale for Nodes
Select the color scale to be used for visualizing the node degree.
Use edge width to visualize the edge weight.
Place labels for nodes and edges.
Number of labels
Adjust how many labels should be placed in the visualization.
Size of labels
Adjust the font size of labels depending on your display size.
An interactive lens can locally change the graph visualization in various ways. Compatible lens effects can be combined.
Local-Edge Filter
Filter edge clutter depending on whether one or both nodes of an edge are inside the lens.
Filter Mode
Bring-Neighbors Transformation
Transform the graph layout so that neighbors of in-lens nodes are brought toward the lens, effectively creating a local neighborhood overview.
Fish-Eye Magnification
Apply a fish-eye magnification to untangle dense and cluttered parts of the graph layout.
Bring-Similar Transformation
Transform the graph layout to arrange similar nodes on concentric circles within the lens, effectively aiding in their comparison.
Similarity Threshold
Only nodes that meet the threshold will be shown inside the lens.
Similarity
Similarity is computed based on the selected node attributes.
Comparison Guides
Guides can be activated to aid in comparing nodes.
The radar projects off-screen nodes to the window border to provide a preview of the information that can be reached when navigating in a certain direction.
Information
iGraph.js is a software for interactive graph visualization. It implements four graph lenses, a radar view, and dynamic labeling as interactive tools to support the exploration of graph data. iGraph.js is based on ideas published in [1], [2], and [3].