Publications
Groups
Groups
Overview
MSAGL is a .NET tool for graph layout and viewing. It was developed in Microsoft by Lev Nachmanson, Sergey Pupyrev, Tim Dwyer and Ted Hart. MSAGL is available as open source here.
All samples use the C# language.
The Distribution Content and Important Features
The package contains the following:
- Layout engine (Microsoft.MSAGL.dll) – The core layout functionality. This component can be used directly in cases when visualization is handled by a tool other than MSAGL.
- Drawing module (Microsoft.MSAGL.Drawing.dll) – The Definitions of different drawing attributes like colors, line styles, etc. It also contains definitions of a node class, an edge class, and a graph class. By using these classes a user can create a graph object and use it later for layout, and rendering.
- Viewer control (Microsoft.MSAGL.GraphViewerGDIGraph.dll) – The viewer control, and some other rendering functionality.
Some important features of the viewer are:
- Pan and Zoom of the graph.
- Forward and Backward navigation.
- Ability to configure tooltips and highlighting of graph entities.
- Ability to search for and focus on entities of the graph.
Layouts Created by MSAGL
FAQ
Do I have control over node positions? Can I request that two nodes should be in the same layer?
This feature has not been implemented yet.
Can a layout be edited by using the viewer?
Yes, see sample Editing.
I have a graph with sub-graphs. Can you layout a graph taking into account sub-graphs and drawing a bounding box around each sub-graph?
This feature has not been implemented.
What is the maximal size of a graph that MSAGL can handle?
Theoretically, there is no limit. In practice, MSAGL is not designed to handle huge graphs. Some MSAGL users were successful in laying out and viewing graphs with 15000 edges. They were doing it on a machine with 4G of RAM, and the waiting time was about 10 minutes. By switching LayoutSettings of the graph to MdsLayoutSettings or RankingLayoutSettings a graph with 50000 elements and more can be processed in a reasonable time.
Can I specify a custom brush for node drawing?
Yes, it can be done by overriding node rendering. See sample NodesWithImages showing how to override node rendering.
Can I set a node label different from its ID?
Yes, use node.Attr.Label.
I need to render a graph on a WEB page. Can MSAGL help here?
Sure. Class Microsoft.Msagl.GraphViewerGDI.GraphRenderer serves this purpose. It can render a graph using just a Graphics object. The only think you need to do is to create a Graphics object and pass it to method Render. See the “Code Sample” tab below for an example.
Can I associate my data with a node or an edge of the graph?
Use field UserData of Node or Edge.
Where can I read a description of how MSAGL works?
There is a technical report explaining the theory behind the tool.
Related Links
Contact Us
Code Samples
Code Samples
All samples use the C# language.
The Viewer sample
Drawing of the graph from the sample
The code snippet demonstrates the basic usage of the viewer.
using System;
using System.Collections.Generic;
using System.Windows.Forms;
class ViewerSample {
public static void Main() {
//create a form
System.Windows.Forms.Form form = new
System.Windows.Forms.Form();
//create a viewer object
Microsoft.Msagl.GraphViewerGdi.GViewer viewer
= new Microsoft.Msagl.GraphViewerGdi.GViewer();
//create a graph object
Microsoft.Msagl.Drawing.Graph graph = new
Microsoft.Msagl.Drawing.Graph("graph");
//create the graph content
graph.AddEdge("A", "B");
graph.AddEdge("B", "C");
graph.AddEdge("A", "C").EdgeAttr.Color =
Microsoft.Msagl.Drawing.Color.Green;
graph.FindNode("A").Attr.Fillcolor =
Microsoft.Msagl.Drawing.Color.Magenta;
graph.FindNode("B").Attr.Fillcolor =
Microsoft.Msagl.Drawing.Color.MistyRose;
Microsoft.Msagl.Drawing.Node c =
graph.FindNode("C");
c.Attr.Fillcolor =
Microsoft.Msagl.Drawing.Color.PaleGreen;
c.Attr.Shape =
Microsoft.Msagl.Drawing.Shape.Diamond;
//bind the graph to the viewer viewer.Graph =
graph;
//associate the viewer with the form
form.SuspendLayout();
viewer.Dock =
System.Windows.Forms.DockStyle.Fill;
form.Controls.Add(viewer);
form.ResumeLayout();
///show the form
form.ShowDialog();
}
}
Rendering an image sample
The image from the sample
This sample shows how to render an image by using class Microsoft.Msagl.GraphViewerGDI.GraphRenderer.
Microsoft.Msagl.Drawing.Graph graph = new
Microsoft.Msagl.Drawing.Graph("");
graph.AddEdge("A", "B");
graph.AddEdge("A", "B");
graph.FindNode("A").Attr.Fillcolor =
Microsoft.Msagl.Drawing.Color.Red;
graph.FindNode("B").Attr.Fillcolor =
Microsoft.Msagl.Drawing.Color.Blue;
Microsoft.Msagl.GraphViewerGdi.GraphRenderer renderer
= new Microsoft.Msagl.GraphViewerGdi.GraphRenderer
(graph);
renderer.CalculateLayout();
int width = 50;
Bitmap bitmap = new Bitmap(width, (int)(graph.Height *
(width / graph.Width)), PixelFormat.Format32bppPArgb);
renderer.Render(bitmap);
bitmap.Save("test.png");
Alternatively, if you have a System.Drawing.Graphics object available, you can draw by using method public void Render(Graphics graphics, Rectangle rect) taking a System.Drawing.Graphics object as an argument.
Sample of using the engine directly
This sample bypasses the layer of the Microsoft.Msagl.Drawing.dll, and Microsoft.Msagl.GraphViewerGDI.dll, and works directly with Microsoft.Msagl.dll. Notice, that in this case the user code is responsible for creation of curves of node boundaries.
using Microsoft.Msagl;
using Microsoft.Msagl.Splines;
class GLEETester {
static void Main(string[] args) {
double w = 10;
double h = 10;
MsaglGraph graph = new MsaglGraph();
Node a = new Node("a", new Ellipse(w, h, new Point()));
Node b = new Node("b", CurveFactory.CreateBox(w, h, new Point()));
graph.AddNode(a); graph.AddNode(b);
Edge e = new Edge(a, b);
graph.AddEdge(e);
graph.CalculateLayout();
}
}
Please also pay attention to sample WindowsApplication which comes with the distribution and that can serve as a starting point. Comments and bugs should be e-mailed to Lev Nachmanson.
