Legend and Usage

Source Code
Some research has found that the graph visulization is readable and interactable for end users under 500 nodes. To reach this principle for large graph, we clustering the source data by LOUVAIN algorithm, and visualize the aggregated graph first. Then, end users are able to do drilling down exploration. If the number of nodes still large on aggregated graph, we can do multi-level aggregation. To control the number of rendering nodes, the earliest expanded cluster will be collapsed automatically. These rules also help us to avoid overloaded computation and rendering on front-end.

<Graph Interaction>

       

Each 'Aggregated Node' represents a cluster generated by LOUVAIN, it contains several 'Real Node' .「Right Click」 any node or edge on the graph, a corresponding contextmenu will show up. Right click and select 'Expand Node', the aggregated node will be replaced by the real nodes of the cluster. You can also right click and select 'Collapse the Cluster' to collapse it, or select 'Find k-Degree Neighbor', A neighbor graph of the selected node will be merged into the current graph.

<The Canvas Menu>


There is a set of assistant tools on the canvas menu, which is on the left top of the canvas. From left to right, they are:
- Show/Hide Edge Labels;
- Fisheye Lens;
- Lasso Select Mode;
- Find the Shortest Path (by clicking select two end nodes);
- Zoom-out;
- Fit the Graph to the View Port;
- Zoom-in;
- Search a Node(by typing the id).


<Notice>

The demo shows a small mocked dataset just for demonstration. Besides the functions introduced above, there are lots of other functions. We hope it is helpful for you. Explore it and have fun!