This is a user guide for using Graph Clustering functionalities.
The interface includes two optional widgets:
- a list of checkboxes in the top left-hand corner for clustering by type implemented in the
GraphClusteringByType.js
- a drop-down menu that appears when you click on a graph node implemented in the
ContextMenuGraphClustering.js
Clicking on any node will display, in a context menu, all the possible actions related to the node.
Action title | Description | Apply to |
---|---|---|
Hide the descendants | Transforms the node into a cluster in which all its descendants are hidden | Nodes with children part of an acyclic subgraph |
Hide the children | Transforms the node into a cluster in which all its children are hidden | Nodes with children part of a cyclic subgraph |
Show the children/descendants | Makes all its children/descendants reappear | Nodes with children |
Hide the children with the type '...' | Creates a new cluster node linked to the clicked node in which all its children with the specified type and their descendant are hidden | Nodes whose children have more than one different type |
Hide / Show the children
Clicking on a created cluster node removes the node from the graph and makes the children reappear.
The class GraphClusteringByType.js
generates a checkbox for each type of node in the graph. Clicking on a checkbox creates a cluster in which all nodes of that type are grouped together.
Node and link clustering works by separating nodes and links into two respective lists:
- Graph.nodes and Graph._nodes for the nodes
- Graph.links and Graph._links for the links
The list named without the '_' contains elements that will be displayed by the graph, while the other list contains elements that will be removed.
We propose two types of clustering:
- neighborhood clustering which hides the descendants or children of a node. To achieve this, a method in class
D3GraphCanvas.js
generates a 'parent' property for each node, corresponding to a list of the node's parents, and a 'child' property associating the node with a list of its direct children. - clustering by type which creates a new cluster containing all nodes of that type.
Note that the links of a node hidden in a cluster with non-hidden nodes are kept dotted.
To enable clustering to work properly, new methods have been added to the class D3GraphCanvas.js
. These methods are located in the “Data functions” section of the code and are documented in the class definition file.