Shapes and Connections overlapping

[Duncan]

I've just been running through some proof of concept scenarios, really quite basic stuff, and I've stumbled onto a case where I've got Shapes overlapping Connections. I'm using an auto layout, tree down, and its a little bit confusing. I've tried adding in padding/margins to various bits and pieces but it doesn't seem to force the objects to sit independently.
I've got a basic sample solution that hopefully helps illustrate the issue.

If you debug this and move the circled shape, you'll see that its not connected to the items to its left and right.

Hopefully its something silly that I'm just doing wrong!


Cheers,
Duncan

[Miro Miroslavov]

Hello Duncan,

 The problem here is that your graph is not actually a tree (a tree is graph that doesn't have cycles), but yours have a cycle and that is making the Tree layout acting not really correct.
I would suggest you if you have any type of graph (not just a tree) to use one of the more generic layout algorithms that we have. Or otherwise you should make sure that your diagram is a tree.
Also it is important to mind the parent-child relationships in order to achieve nice looking routing of the connections.
Let us know your comments.

All the best,
Miro Miroslavov
the Telerik team

[Duncan]

That makes sense, thanks for the prompt response Miro.

Unfortunately, the structures I'll be generating will inherently have some cycles. I've had a quick play with the Sugiyama algorithm, it seems to do a pretty reasonable job at rendering it but it seems.. upside down. The node that I'd ideally like to be the root is at the bottom of the page; Ive tried reversing the order in which the nodes are added and likewise with the connections - it really likes having my 'root' node at the bottom. Any suggestions?

[Francois Vanderseypen]

Duncan,

there are more elegant ways to do what you want but it would require some changes in the layout code; something like inserting an ordering delegate so that the tree traversal occurs according to some order in the graph definition. 
A working alternative to this is simply changing the order in which the connections are defined (not as you tried the order of the nodes being added). It is indeed the connections which define the way the graph is traversed and not the nodes. So, in your case, if you define:

linkShapes(a1, b3);
linkShapes(a1, b1);
linkShapes(b1, b2);
linkShapes(b3, b4);
linkShapes(b2, c2);
linkShapes(c2, c1);
linkShapes(b3, c2);
linkShapes(c1, d2);
linkShapes(d2, d1);
linkShapes(c2, d3);
linkShapes(d3, d4);

you end up with a layout as attached and which I'd hope is more the way you want it.

Hope this helps, Fr.