Introduction to Directed Graph Markup Language ( DGML )


DGML, or "Directed Graph Markup Language" is what we are using in VSTS 2010 Architecture to render graphs like the one below:
image_thumb3[1] 

The power of DGML is in its simplicity. Let me show you what I mean.

If you launch the VSTS 2010 CTP, open a project, click View->Architecture Explorer, then click the button shown below…
 image_thumb8

…you’ll get a new dgml editor in the document well. You can then right click inside that document and select "View Code". Right click on the tab of the resulting editor and select "New Horizontal Tab Group". You’ll have something similar to this:

image_thumb14 

If you add a Link element as a child element to the Links node, with a Source and Target attribute, you’ll get something similar to this:

image_thumb17 

To add a few more elements, try this:

image_thumb20

You’ll notice the Nodes element isn’t even needed to render the graph above. That is really all you need to know to visualize all kinds of data. Rest assured there is a lot more goodness to discuss about this technology, but the simplicity of it is one of the most exciting aspects as far as I’m concerned!

In my next post, I’m actually going to show you how, armed with just this little nugget of DGML information, you can visualize some Java code. Stay tuned!

Comments (29)

  1. Are there any plans to allow the diagramming surface to be used outside VS?

    Are there alternative layout algorithms or only the tree layout?

  2. In regards to you "outside VS" question, no plans for VSTS 2010.

    There are different layout capabilities that you can see in the 2010 CTP, but I’ll also be showing a couple in some future posts as well.

  3. El Bruno says:

    Really cool !!! … and the matrix view, the hierarchical one, etc are soo cool 😀

    Best regards

  4. Jeremy Gray says:

    Congratulations, you just reinvented RDF!

  5. El Bruno says:

    Buenas, el bueno de Cameron Skinner, hoy me ha dado pie para terminar de cerrar un post que habia comenzado

  6. El Bruno says:

    Buenas, el bueno de Cameron Skinner, hoy me ha dado pie para terminar de cerrar un post que habia comenzado

  7. It became clear from the emails and comments to my last post that I should probably spend a little more

  8. Mathias says:

    Very verbose. I like the dot language that Graphviz uses.

  9. In this last post I introduced you to some very basic understanding of how DGML works. Now I want to

  10. In this previous post I introduced you to the new format, and then this follow on post showed some of

  11. [Nacsa Sándor, 2009. január 19-31.] Ez a Team System változat a szolgáltatás-orientált (SOA) elosztott

  12. pvila says:

    Do you have plans to integrate this tool  in a VS specific domain or as an independent project template?

  13. You will be able to create DGML files via stand-alone project item template.

  14. Tobias says:

    @Jeremy Gray: They didn’t reinvent RDF but GraphML. See http://graphml.graphdrawing.org/

    DGML ist exactly the same as GraphML…

  15. Fakher Halim says:

    It is really impressive! I am developing a powershell utility to create DGML for my developmental inventory, and desperately need all resources on DGML. Is there any documentation of individual attributes, e.g. FilePath?

  16. Sadi Khan says:

    Hey Fakher!

    Thanks for your interest in DGML! We definitely have some resources for you to ramp up on DGML.

    I would start with:

    http://msdn.microsoft.com/en-us/library/dd409453(VS.100).aspx

    It covers a lot initial ground on DGML such as using custom properties and categories which can be extremely powerful especially when combined with our rich styling support.

    To get more ideas on leveraging DGML in various ways, a great blog is Chris Lovette’s  (an architect working on DGML) blog : http://www.lovettsoftware.com/blogengine.net/

    I’m a PM working on DGML – so please feel free to send some mail my way (Sadik at microsoft.com)with more questions and comments. I can send you some samples that may be of assistance once I understand your problem space a little better 🙂

  17. Fakher Halim says:

    Sadi,

    Thanks for your reply. Sure they are great resources, and I went through them. As an architect I was very impressed with the mind blowing capabilities of VS 2010 to quickly turn few lines of DGML into wonderful interactive graphics! In fact I have suspended some of my legacy reporting plans in favor of the forthcoming VS 2010 capabilities, and am creating DGML fragments from Powershell by parsing .sln, .csproj, mssccprj.scc, assembly versions … and then storing their dependencies in SQL Server tables to have corporate-vide code dependency visualizations. In the absence of an extensive reference manual (unsuccessful BINGing/Googling), and watching Chris Videos I just figured out without much pain to write down simple DGML like  <Link Source="A" Target="B"  />, and with few more hours effort in opening up a C# dependent file by double on figure like:

    <Node Id="A" Category="FileSystem.Category.FileOfType.cs" FilePath="Program.cs"  Label="Program.cs"> <Category Ref="File" /></Node>.

    Please reply my email — I would be looking forward to even un-finished/preliminary links to DGML reference material.

  18. Marc says:

    Hi! This looks like a great graphing tool. Will there be a possibility for .NET projects to use the DGML editor in their own application? I can imagine quite a few use cases for a proper directed graph interface. If it is as easy as it seems to be, many applications may benefit from it.

    Marc

  19. Cameron says:

    This is something we would like to enable in the future, but currently, we do not have support for that in the product.

    But again, definitely on our list of items we need to consider for the next release.

  20. catatonic says:

    apart from using the dgml editor in winforms or wpf applications will it available for silverlight

  21. catatonic says:

    Are the progression APIs any useful for creating a graph through code… And any time frame when the dgml editor will be released on the WPF or SilverLight Platform.

  22. @API: We’ll be releasing a PowerTool that exposes a GraphModel API that will make this easier shortly.

    @SL: No timeframe to announce as of yet.

  23. catatonic says:

    Any updates on the release of an API

  24. No specific release of an API. However, there will be an API that manipulates the DGML nodes and links that accompany the ability to extend our Layer Diagram validation features. See this link for more details on that:

    http://blogs.msdn.com/camerons/archive/2010/03/19/announcing-the-first-feature-pack-for-vs2010-visualization-and-modeling-tools.aspx

  25. catatonic says:

    is dgml is built on MSAGL..

  26. DGML has nothing to do with MSAGL. DGML is the markup we persist to.

    The graph layout that we use to visualize the DGML does use MSAGL.

    Cameron

  27. Davele says:

    Nice Article, Was just enough for me to see what it does & how easy it is. Within an hour or so I've just created a prototype SQL Object Dependancy viewer.

  28. Excellent! Would love to see the results….