Filtering graph elements in yFiles.NET, WPF and Silverlight

Tips & Tricks

Summary

This article demonstrates different possibilities to filter graph elements in an IGraph in yFiles.NET, yFiles WPF or yFiles for Silverlight.

Description

There are several possibilities for temporarily hiding graph elements (a process also known as filtering). Note that it is perfectly possible to use combine these approaches:

Use FilteredGraphWrapper

FilteredGraphWrapper is an implementation of the IGraph interface that decorates an existing IGraph instance. FilteredGraphWrapper uses predicates to decide which graph elements should be visible in the filtered graph, namely NodePredicate and EdgePredicate to filter nodes and edges, resp. The predicates should return true if the element should be visible. The following example uses FilteredGraphWrapper to display only nodes where the UserTag is true:

var filteredGraphWrapper = new FilteredGraphWrapper(graphControl.Graph, 
        (node) => node.Tag is bool && (bool)node.Tag, 
        (edge) => true);
graphControl.Graph = filteredGraphWrapper;

Advantages

The filtered elements are structurally absent from the filtered graph, i.e. working on a structural level corresponds exactly to the graph structure that is currently visible. This is necessary for layout and analysis algorithms to yield a correct result.

Disadvantages

When the predicate changes, it must be reevaluated manually by calling NodePredicateChanged or EdgePredicateChanges

Disable only the actual rendering

If you just want to make the elements temporarily invisible (i.e. they may still be structurally present, just not rendered onto the screen), you can either

  1. temporarily assign a VoidNodeStyle or VoidEdgeStyle instance to them: graph.SetStyle(node, VoidNodeStyle.Instance)
  2. Use a NodeControlNodeStyle or EdgeControlNodeStyle together with custom WPF/Silverlight styles that hide themselves if certain conditions for the graph element (or its UserTag) are true. Usage of Node/EdgeControl styles is shown in the samples in the StyleDemos solution folder.
    This solution is not available in yFiles.NET
  3. Implement a custom node or edge style that doesn't draw itself when certain conditions are true. Implementing a custom node style is shown in the Custom Styles tutorial.

Advantages

  • The graph is not modified structurally, which may be necessary for certain applications.
  • Solutions 2. and 3. work automatically (although an explicit Invalidate() call on the GraphControl may be necessary).
  • Solution 2. can be implemented with standard WPF/Silverlight mechanisms.

Disadvantages

  • Since the graph is not modified structurally, layout and analysis algorithms won't work correctly, as do all applications that rely on a 1:1 correspondence between visibility and graph structure.

Categories this article belongs to:
yFiles WPF > yFiles WPF Viewer > Displaying and Editing Graphs
yFiles for Silverlight > yFiles for Silverlight Viewer > Displaying and Editing Graphs
yFiles.NET > yFiles.NET Viewer > Displaying and Editing Graphs
Applies to:
yFiles.NET: 3.2, 3.3, 4.0, 4.1, 4.2, 4.3
yFiles WPF: 2.0, 2.1, 2.2, 2.3, 2.4
yFiles for Silverlight: 2.0, 2.1, 2.2, 2.3
Keywords:
FilteredGraphWrapper - filter - filtering - hiding - hide - IGraph