Microsoft Automatic Graph Layout
MSAGL is a .NET library and tool for graph layout and viewing.
MSAGL was developed in Microsoft by Lev Nachmanson, Sergey Pupyrev, Tim Dwyer, Ted Hart, and Roman Prutkin.
Getting Started
The simplest way to start with MSAGL in C# is to open GraphLayout.sln in Visual Studio, and and look at the Samples folder.
MSAGL Modules
The Core Layout engine (Microsoft.MSAGL.dll) - NuGet package
This .NET asssembly contains the core layout functionality. Use this library if you just want MSAGL to perform the layout only and afterwards you will use a separate tool to perform the rendering and visalization.
The Drawing module (Microsoft.MSAGL.Drawing.dll) - NuGet package
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.
A Viewer control (Microsoft.MSAGL.GraphViewerGDIGraph.dll) - NuGet package
The viewer control lets you visualize graphs and has and some other rendering functionality. Key features: (1) Pan and Zoom (2) Navigate Forward and Backward (3) tooltips and highlighting on graph entities (4) Search for and focus on graph entities.
Code Samples
The code snippets demonstrate the basic usage of the viewer. It uses the C# language.
The Viewer sample
Drawing of the graph from the sampleDrawing of the graph from the sample
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").Attr.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();
}
}
More code
samples can be found here…
GraphMaps
GraphMaps lets you view very large graphs like oneline maps - as you zoom in more detail is revealed. Watch a video that shows how GraphMaps works, and here is the video of the previous version.
Using GraphMaps
- open Lg.sln and build the solution,
- run TestGraphMaps.
NOTES:
- The configuration Release/x64 needs to be used to load a large graph.
- The graph from the video can be found in GraphLayout/graphs/composers.zip. Please load composers.msagl to avoid the preprocessing step.
- If composers.dot is loaded then composers.msagl and the tiles directory composers.msagl_tiles will be
regenerated.
Learn More
The ideas, design, and the mathematics of GraphMaps are described in this paper.
Layouts Created by MSAGL
MSAGL in JavaScript
WebMSAGL is a version of MSAGL that was transcompiled to JavaScript with SharpKit, plus a TypeScript wrapper and rendering/interaction layer that provides a friendly TypeScript API. You can create a graph either programmatically or from a JSON object, have MSAGL create a layout for it, and then render it to an HTML Canvas or to an SVG block. All layout operations are run in a web worker, ensuring that your application remains responsive while computation is taking place. Limited interactivity is also supported.
Using WebMSAGL
- open WebMsagl.sln and build the solution,
- set index.html from any of the sample folders as the starting page,
- run WebMsagl.
Code of Conduct
This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact opencode@microsoft.com with any additional questions or comments.