wpf - GraphSharp 树布局从左到右

Question

我尝试使用 CodePlex 的 GraphSharp 创建树。

我查看了示例应用程序并尝试“重新设计”该示例。

问题是，如果我尝试以编程方式设置 LayoutAlgorithmType = "Tree"，我会得到一个 TargetInvocationException... 这很神秘，因为在示例中它有效。

我的问题是:如何创建一个具有树状布局和从左到右方向的图表。

提前致谢:)

我的代码:

public partial class MainWindow : Window
{
    private IBidirectionalGraph<object, IEdge<object>> _graphToVisualize;

    public IBidirectionalGraph<object, IEdge<object>> GraphToVisualize
    {
        get { return _graphToVisualize; }
    }

    public MainWindow()
    {
        CreateGraphToVisualize();

        InitializeComponent();
    }

    private void CreateGraphToVisualize()
    {
        var g = new BidirectionalGraph<object, IEdge<object>>();



        string[] vs = new string[5];
        for (int i = 0; i < 5; i++)
        {
            vs[i] = i.ToString();
            g.AddVertex(vs[i]);
        }

        //add some edges
        g.AddEdge(new Edge<object>(vs[0], vs[1]));
        g.AddEdge(new Edge<object>(vs[0], vs[2]));
        g.AddEdge(new Edge<object>(vs[2], vs[3]));
        g.AddEdge(new Edge<object>(vs[1], vs[4]));
        g.AddEdge(new Edge<object>(vs[3], vs[4]));

        layout.LayoutMode = LayoutMode.Automatic;
        layout.LayoutAlgorithmType = "Tree";

        _graphToVisualize = g;

    }
}

xaml:

<Window x:Class="Test.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:graphsharp="clr-namespace:GraphSharp.Controls;assembly=GraphSharp.Controls"
        xmlns:GraphSharp_Controls="clr-namespace:GraphSharp.Controls;assembly=GraphSharp.Controls"
        xmlns:graph="clr-namespace:GraphSharp.Controls;assembly=GraphSharp.Controls"
        xmlns:Controls="clr-namespace:WPFExtensions.Controls;assembly=WPFExtensions"

        Title="MainWindow" Height="350" Width="525"
        x:Name="root">

    <Grid>
        <Controls:ZoomControl>
            <graph:GraphLayout x:Name="layout" />
        </Controls:ZoomControl>

    </Grid>
</Window>

Answer 1

看了graph# lib的源码，自己找到了解决办法。

首先，您必须将 LayoutAlgorithm 添加到您的命名空间:

xmlns:tree="clr-namespace:GraphSharp.Algorithms.Layout.Simple.Tree;assembly=GraphSharp"

之后，您可以向 GraphLayout 添加额外的 LayoutParameter。在我的例子中，我只是将树的方向从 TopToBottom 更改为 LeftToRight。

<graphsharp:GraphLayout x:Name="graphLayout"
                                Graph="{Binding ElementName=root,Path=GraphToVisualize}"
                                LayoutAlgorithmType="Tree"
                                OverlapRemovalAlgorithmType="FSA"
                                HighlightAlgorithmType="Simple" RenderTransformOrigin="0.5,0.5">
            <graphsharp:GraphLayout.LayoutParameters>
                <tree:SimpleTreeLayoutParameters Direction="LeftToRight"></tree:SimpleTreeLayoutParameters>
            </graphsharp:GraphLayout.LayoutParameters>
        </graphsharp:GraphLayout>

因此，如果您想更改图表的参数，您必须查看(例如，在 Visual Studio 的解决方案资源管理器中)算法 .->Layout->Simple->Tree -> SimpleTreeLayoutParameters 在我的例子中。