Hi,

Has anyone used NetDiagram to create a State Diagram (may be called a State Machine)?
If so, I'd be interested to know what layout you used, or whether it was created without a built-in layout.  I will be creating the diagram from a database; the user will not be able to interact with it.

Thanks in advance for any ideas or examples.

Jim

Hi Stoyan,

Thanks for the tip.  It gave me some ideas.
Actually, I've produced a decent looking diagram using the OrthogonalLayout followed by the OrthogonalRouter layout.  I just have 2 issues.

First, the text on the links is not center'd on the links.
Second, the diagram is somewhat reversed (vertically) in that the BPMN start shape is at the bottom and the terminate/end shape is at the top.  I still find the diagram readable, but would like it if I could get the start shape at the top.

For my first issue, here's some relevant code snippets:

protected void createLink(ShapeNode sourceNode, ShapeNode targetNode, string trigger, Diagram diagram)
    {
        Factory factory = diagram.Factory;
        DiagramLink link = factory.CreateDiagramLink(sourceNode, targetNode);
        link.Font = new Font("Arial", 8, System.Drawing.FontStyle.Regular);
        link.ShadowOffsetX = 0;
        link.ShadowOffsetY = 0;
        link.Text = trigger;
        link.HeadBrush = transitionLineColour;
        link.TextStyle = LinkTextStyle.Rotate;
        link.Style = LinkStyle.Polyline;
        link.TextAlignment = StringAlignment.Center; // <<<<<<----- Text Is NOT center'd on diagram!!!!
    }

case "OrthogonalRouter":
                {
                    OrthogonalLayout layout = new OrthogonalLayout();
                    layout.Padding = 40;
                    layout.Arrange(diagram);
                    OrthogonalRouter layout2 = new OrthogonalRouter();
                    layout2.Arrange(diagram);
                    break;
                }

A sample image is attached, along with the complete class.

Any thoughts or suggestions on either issue?

Thanks in advance

Jim

At this time you can't specify fixed positions for nodes in OrthogonalLayout. If you detect that your start node is closer to the bottom of the diagram, you could mirror the arranged diagram vertically to bring that node to the top:

void MirrorVertically(Diagram diagram)
{
	var bounds = diagram.GetContentBounds(false, true);
	var y = bounds.Y + bounds.Height / 2;
	foreach (DiagramNode node in diagram.Nodes)
	{
		var ny = node.GetCenter().Y;
		var dy = ny - y;
		MoveNode(node, y - dy);
	}
	foreach (DiagramLink link in diagram.Links)
	{
		for (int i = 0; i < link.ControlPoints.Count; i++)
		{
			var p = link.ControlPoints[i];
			var dy = p.Y - y;
			p.Y = y - dy;
			link.ControlPoints[i] = p;
		}
		link.UpdateFromPoints(false, false);
	}
	diagram.Invalidate();
}

void MoveNode(DiagramNode node, float newY)
{
	var bounds = node.Bounds;
	bounds.Y = newY - bounds.Height / 2;
	node.SetBounds(bounds, false, false);
} 

You could also consider using LayeredLayout - it provides StartNode and EndNode properties.

I hope that helps,
Stoyan

Stoyan,

Your code to mirror the diagram worked perfectly and accomplished exactly what I needed.

However, the other code snippet to deal with the center'd text issue does not work - the if condition is never true. Any thoughts?

Thanks

Jim