Transitivity Demo

Transitivity algorithms are heavily applied to graphs in order to answer reachability questions such as "Is it possible to reach node x from y?". Common application fields are social networks, dependency graphs, bioinformatics, citation graphs or criminal networks in which possible relations between two entities have to be quickly identified and investigated.

Algorithms

The user can select one of the available algorithms from the algorithms' combo box. Selecting the Original Graph will bring the graph to its original state without the transitive edges.

Transitive Closure

Transitivity Closure is applied in order to answer the question whether there exists a directed path between two nodes. The algorithm adds an edge to the graph for each pair of nodes, that are not direct neighbors, but connected by a path in the graph. The transitive edges are visualized in blue color.

Transitive Reduction

Transitivity Reduction is the reverse operation to transitive closure which removes edges between any two nodes if there exists another path that connects them. This means that in the end, the graph remains with as few edges as possible but has the same reachability relation as before. The user can choose to show or hide transitive edges using the -Button of the toolbar.

Graph Information

Package Name:
Number of Dependents:
Number of Dependencies:
Current Number of Nodes:
Current Number of Edges:

Loading npm packages. This may take a while.

Sample Graphs

This demo shows how transitive closure and reduction algorithms of yFiles can be applied to a given graph. The user can select a graph from the sample graphs' combo box. The first sample graph represents the yfiles for HTML modules dependencies graph, while the second one shows the dependencies of npm packages.

yFiles Modules Graph

This graph presents an overview of the dependencies between the different yFiles for HTML modules. The user can select a node and investigate its dependents and dependencies.

npm Package Graph

This sample graph is not available online.

This graph presents the dependencies of an npm package. The user can specify the package name using the text area in the toolbar. Due to a possible large number of dependencies, only a small number of them is visualized at once. If a node has more dependencies, the user can query more of them by pressing the plus symbol on the right part of the node.

Browsing the npm packages needs a proxy server which is provided by the Demo Server. In order to run the Demo Server, execute:

> npm install 
> npm start

in the root folder of the extracted yFiles for HTML package.