Page Index Toggle Pages: 1 Send TopicPrint
Normal Topic Problem with a flowchart layout (Read 2255 times)
theredguy
YaBB Newbies
*
Offline


I love YaBB 1G - SP1!

Posts: 3
Joined: May 26th, 2011
Problem with a flowchart layout
Apr 16th, 2013 at 1:33am
Print Post  
I am having a problem with the layout of what is essentially a flowchart. It works perfectly in most cases but I have a particular diagram that just produces a mess.

I have 44 nodes and 143 links. The main problem is that there are a few nodes that have 7-8 connections and they are at multiple levels. I don't think it is going to be possible to not have any crossed links but to reduce to them to a few would be great.

I would like to keep them in a layered format and have tried layered and flowchart. I also have tried spring but none of them produce what I would like.

Is there any configuration or perhaps change the definition of nodes/links to assist the layout to produce something more readable. Some guidance on which layout would be the best choice.

I have attached the flowchart layout and an XML file exported from Diagram showing the structure so you can see exactly what I mean.
  

FlowChartExamples.zip (Attachment deleted)
Exported_Diagram.zip (Attachment deleted)
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Problem with a flowchart layout
Reply #1 - Apr 16th, 2013 at 8:51am
Print Post  
If there were at most 7-8 links per node, probably it wouldn't be that hard to arrange this, but there are some nodes with 15 or more links (e.g.the Stop.RiskWatch and Postprocess Cubes ones), and it's not possible to avoid crossings while also arranging nodes in layers and keeping connected nodes close to each other. Since the nodes have very narrow shapes, you will get better results if you run horizontal layered layout, this way the links will have more space for bending around the nodes. E.g. this leaves 6-7 links overlapping with nodes, and you could also move the links to back of Z order to prevent them from crossing over nodes:

Code
Select All
foreach (var node in diagram.Nodes)
	node.AnchorPattern = AnchorPattern.LeftInRightOut;

var ll = new LayeredLayout();

ll.Anchoring = Anchoring.Reassign;
ll.NodeDistance = 15;
ll.LayerDistance = 20;
ll.Orientation = MindFusion.Diagramming.Layout.Orientation.Horizontal;
ll.Direction = Direction.Straight;
ll.IgnoreNodeSize = true;
ll.EnforceLinkFlow = true;
ll.Arrange(diagram); 



If you prefer a vertical layout, try this code, which makes it as compact as possible, and does some post-processing to avoid nodes overlapping:

Code
Select All
foreach (var node in diagram.Nodes)
	node.AnchorPattern = AnchorPattern.TopInBottomOut;

var ll = new LayeredLayout();

ll.Anchoring = Anchoring.Reassign;
ll.NodeDistance = 30;
ll.LayerDistance = 30;
ll.Direction = Direction.Straight;
ll.IgnoreNodeSize = true;
ll.EnforceLinkFlow = true;
ll.Arrange(diagram);

var layers = new Dictionary<int, List<DiagramNode>>();
foreach (var node in diagram.Nodes)
{
	if (!ll.Statistics.NodeLayerIndices.ContainsKey(node))
		continue;
	var l = ll.Statistics.NodeLayerIndices[node];
	if (!layers.ContainsKey(l))
		layers[l] = new List<DiagramNode>();
	layers[l].Add(node);
}

foreach (var layer in layers.Values)
{
	layer.Sort((n1, n2) => n1.Bounds.X.CompareTo(n2.Bounds.X));
	for (int i = 1; i < layer.Count; i++)
	{
		var node = layer[i];
		var prev = layer[i - 1];
		if (node.Bounds.Left <= prev.Bounds.Right)
			node.Move(prev.Bounds.Right + 5, node.Bounds.Y);
	}
} 



Some other layout classes you might try that seem to create legible layouts for this graph are CascadeLayout, TopologicalLayout and AnnealLayout, but they don't arrange nodes in layers.

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


I love YaBB 1G - SP1!

Posts: 3
Joined: May 26th, 2011
Re: Problem with a flowchart layout
Reply #2 - Apr 19th, 2013 at 7:41pm
Print Post  
That is perfect. It clearly shows  that dependencies are wrong (overly complex) but it is now readable and you can workout which are the links that are unnecessary and which ones should be removed to produce a layout with no crossed links.

Thanks for your help in this.
  
Back to top
 
IP Logged
 
Page Index Toggle Pages: 1
Send TopicPrint