Page Index Toggle Pages: 1 Send TopicPrint
Normal Topic Layout for avoid overlapping nodes (Read 5361 times)
Gabriel
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 30
Joined: Oct 9th, 2012
Layout for avoid overlapping nodes
Feb 13th, 2014 at 8:13am
Print Post  
Hello,

I have a diagram on which the nodes have the x coordinate predefined so they can only be rearranged using the y coordinate.

Is there any layout that could help me to display the nodes without overlappings and "reducing" the amount of link crossing?

Thank you in advance

Gabriel
  
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Layout for avoid overlapping nodes
Reply #1 - Feb 13th, 2014 at 9:12am
Print Post  
Hi,

If you need the nodes arranged in columns, try a vertical SwimlaneLayout. You will need to match the grid's column positions to your predefined X coordinates, and assign the columns index to respective node's LayoutTraits[SwimlaneLayoutTraits.Lane] property.

I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
Gabriel
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 30
Joined: Oct 9th, 2012
Re: Layout for avoid overlapping nodes
Reply #2 - Feb 13th, 2014 at 12:40pm
Print Post  
Hello,

Each node can have a different x position so each node has its "own" column.
The idea is to try to rearrange the nodes vertically to not overlap. The y coordinate is free for all, they only need to not overlap, and between arranges that have the same geometry, pick the one that reduces the link crossing.

Gabriel
  
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Layout for avoid overlapping nodes
Reply #3 - Feb 13th, 2014 at 2:29pm
Print Post  
Is there any chance two nodes to be on same X position, or it's always unique?
  
Back to top
 
IP Logged
 
Gabriel
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 30
Joined: Oct 9th, 2012
Re: Layout for avoid overlapping nodes
Reply #4 - Feb 13th, 2014 at 3:50pm
Print Post  
Sometimes they could be the same, but normally they will have different values.

Imagine a Gantt type diagram, on which every node must be placed on a fixed x position (the time position) and I need to rearrange them vertically to avoid overlaps.
  
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Layout for avoid overlapping nodes
Reply #5 - Feb 14th, 2014 at 7:17am
Print Post  
LayeredLayout has some code that shuffles nodes from each layer to minimize crossings between layers, however it will place the layers at even distances instead of preserving your X coordinates. Try running it on a copy of the diagram and then copy back only the Y coordinates as set by the Arrange method:

Code
Select All
var copy = new Diagram();
copy.LoadFromString(diagram.SaveToString());

var currentLayer = -1;
var currentX = float.NegativeInfinity;
var nodes = copy.Nodes.Clone();
nodes.Sort((n1, n2) =>
	n1.Bounds.X.CompareTo(n2.Bounds.X));
foreach (var node in nodes)
{
	var x = node.Bounds.X;
	if (x != currentX)
	{
		currentLayer++;
		currentX = x;
	}
	node.LayoutTraits[LayeredLayoutTraits.Layer] = currentLayer;
}

var ll = new LayeredLayout();
ll.StraightenLongLinks = true;
ll.EnableCustomLayers = true;
ll.Orientation = MindFusion.Diagramming.Layout.Orientation.Horizontal;
ll.Arrange(copy);

for (int i = 0; i < diagram.Nodes.Count; i++)
{
	var n = diagram.Nodes[i];
	var c = copy.Nodes[i];
	n.Move(n.Bounds.X, c.Bounds.Y);
}

for (int i = 0; i < diagram.Links.Count; i++)
{
	var l = diagram.Links[i];
	var c = copy.Links[i];
	if (c.SegmentCount == 1)
	{
		l.SegmentCount = 1;
	}
	else
	{
		// there should be three segments if StraightenLongLinks is set
		l.AutoRoute = false;
		l.Shape = LinkShape.Polyline;
		l.SegmentCount = 3;
		var bend1 = c.ControlPoints[1];
		var bend2 = c.ControlPoints[2];
		float dist = Utilities.Distance(
			l.Origin.GetCenter(), l.Destination.GetCenter());
		float dx = l.Destination.GetCenter().X - l.Origin.GetCenter().X;
		dx /= dist;
		bend1.X = l.StartPoint.X + dx * 10;
		bend2.X = l.EndPoint.X - dx * 10;
		l.ControlPoints[1] = bend1;
		l.ControlPoints[2] = bend2;
		l.UpdateFromPoints();
	}
} 



I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
Gabriel
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 30
Joined: Oct 9th, 2012
Re: Layout for avoid overlapping nodes
Reply #6 - Feb 18th, 2014 at 3:35pm
Print Post  
Hello,
Thank you for the idea, however it is not working for me and I don't know why.

I have three nodes: A->B->C, the three nodes begin in the same x,y position:

{X = 43.8709679 Y = 89.19791 Width = 8.0 Height = 8.0}

After I apply the layered layout following your suggestion this is the final position of the three nodes:

copy.Nodes[0].Bounds = {X = 5.0 Y = 5.0 Width = 8.0 Height = 8.0}
copy.Nodes[1].Bounds = {X = 38.0 Y = 5.0 Width = 8.0 Height = 8.0}
copy.Nodes[2].Bounds = {X = 71.0 Y = 5.0 Width = 8.0 Height = 8.0}

So instead of movin the nodes on vertical to avoid overlapping is moving them on horizontal, so when I copy back only the Y coordinate, they are at the same position again.

Also the LayeredLayoutStatistics is not usefull.

Any idea about what is happening here?

Thank you again for your help.

Gabriel
  
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Layout for avoid overlapping nodes
Reply #7 - Feb 19th, 2014 at 12:54pm
Print Post  
Hi,

If the nodes are not connected with links, that's the result of the MultipleGraphsPlacement property handling, its default value is Horizontal. LayeredLayout might not be a good idea for this if your charts contain such nodes, because it will arrange each connected sub-graph on its own. You could create some temporary links to unconnected nodes to make sure all nodes are placed in the same layout. Or try applying SwimlaneLayout instead, it treats all nodes as a single graph even if not connected.

I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
Gabriel
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 30
Joined: Oct 9th, 2012
Re: Layout for avoid overlapping nodes
Reply #8 - Feb 19th, 2014 at 3:20pm
Print Post  
Hello,

The nodes are connected, A with B and B with C (A->B->C)

The whole problem is as follow:

I have a flowchart with nodes, some of them are forming a subgraph, and I need to rearrange the subgraph's nodes independent of the rest of nodes, avoiding overlaping on the "subgraph".

My first step is copy only the subgraph with the links on a fake diagram and apply the layout this give me a "logical " order of the nodes, that I copy back to the original graph.

Thank you for your help
Gabriel
  
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Layout for avoid overlapping nodes
Reply #9 - Feb 20th, 2014 at 7:09am
Print Post  
Hi,

If by logical order you mean one where links would always flow from top to bottom, then you don't want to assign custom layers, but use the ones set by LayeredLayout with EnforceLinkFlow option enabled. E.g. this would place A at top, B in the middle and C at bottom of arranged subgraph from your example:

Code
Select All
var copy = new Diagram();
copy.LoadFromString(diagram.SaveToString());

var ll = new LayeredLayout();
ll.EnforceLinkFlow = true;
ll.Arrange(copy);

for (int i = 0; i < diagram.Nodes.Count; i++)
{
	var n = diagram.Nodes[i];
	var c = copy.Nodes[i];
	n.Move(n.Bounds.X, c.Bounds.Y);
} 



I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
Page Index Toggle Pages: 1
Send TopicPrint