Consulting
Portfolio
Customer care
Products for Silverlight
Products for WPF
Product manuals
Business Projects Portfolio
Products Portfolio
R&D Portfolio
Mockups Portfolio
Contact us
Company Profile
Who
Large diagrams and layout algorithms in WPF
In a previous article I already showed how large diagrams can benefit from layout algorithms. Netron was at the basis of the pretty pictures in this article and it was fairly easy to port the code to WPF, though WPF has some threading intricacies:
- Although the BackgroundWorker helper class is supposed to help in using non-UI threads in your application, it did not perform as expected on various occasions. Here I was unable to trace the source of the problme…threading issues are in general horrendous to pinpoint.
- The Dispatcher object is your friend when it comes to marshalling modifications from a thread to the UI-thread. The mechanism is easy to use but it can be at times difficult to access the Dispatcher when your architecture is based on a MVC (read: whatever pattern acronym you have chosen to build your WPF application) pattern.
- There seems to be at times a difference between using the Dispatcher you get from the UI elements and the one you access through the Application.Dispatcher property.
- In general, you should minimize the stuff you perform in a BeginInvoke call to keep the Dispatcher queue lightweight.
- Is it possible to access a property rather than a method through the Dispatcher? Can one change the location of a UI-element through the Dispatcher? I haven’t been able to to that, which seems to be a rather crual constratint sometimes.
- The VS2008 just stops sometimes because some debugging optimization was ‘optimized away’! This occurs when you try to peek into properties of some objects in the non-UI thread.
There is no noticeable difference between using layout algorithms in WPF and in GDI, the positioning and handling of coordinates is similar. On the other hand, there is a big difference between the responsiveness of WPF. In the examples below I was able to lay out 1500 nodes in less than five seconds but altering the diagram or scrolling produces grinding sounds. Obviously the cause is in the usage of the Control as a base class and the heavy weight of carrying animation, databinding and other stuff which for large diagrams is usually less an advantage. Using the System.Windows.Shapes namespace of .Net would be a better choice for big diagrams and layout.
When it comes to diagramming there is always a choice between sacrificing features or sacrificing scalability. There is also the balance between making a general purpose control and implementing stuff for a particular target group. For example, if you are interested in HMI diagrams you are not interested in large diagrams and vice versa. As well as the choices in what to deliver as shape libraries. Because it’s really hard to enable users to create shapes without understand the API (or opening the source code) one has to deliver a common set of shape libraries, but of course everyone has particular needs. If you use Visio you can easily add new shape to libraries but I wonder whether the serialized shapes are just groupings of predefined elements or really standalone blocks. In that respect one can consider grouping of basic shapes a good solution for a wide audience. I think, however, that for custom diagramming solutions and integrations one inevitably flows into custom code and custom diagramming controls. Diagramming software cannot be separated from consultancy unless you constraint yourself to the average (common) needs.
But anyway, in April 2006 I produced large diagrams in Netron and here they are again but based on pure WPF code. The first screenshot represents randomly generated nodes on the diagramming surface.
The radial produce in less than three seconds a beautiful set of concentric nodes:
The balloon tree layout produced a rather dispersive diagram is the same time span:
Finally, the force directed layout produced the expected organic layout in tick more than five seconds:
14 Responses to Large diagrams and layout algorithms in WPF
Leave a Reply
Experiments
D3 line chart
Line chart created with d3.js. See also the associated blog post on how it was done.
Pointiliisme
Point effect on an existing image, using Processing.
Random motion
Processing spider.
Spring layout | JS
Voronoi tesselation
Hi,
By Niks August 14, 2008 - 12:00 amCan you please publish WPF sample code here?
Thank you
You can find the code of the layout algorithms inside Netron. The WPF presentation is different than the GDI one but that portion of the code is not open.
By Me August 21, 2008 - 7:53 amHi,
I might be interested by a commercial usage of your diagramming framework right now. Can you contact me by email so that we can discuss about that ?
Regards,
By Jeremy September 12, 2008 - 4:48 pmJeremy
Sent you an Email Jeremy, let me know what you’re looking for.
By Me September 13, 2008 - 5:00 pmFirst time on your site. I’m a bit confused about what is “Netron” and what is “Unfold” and what is “GraphSquare”.
I’m also not able to access http://www.orbifold.net/unfold/
By Shawn Miller September 14, 2008 - 4:27 amNetron was a pure GDI pre-WPF diagramming library. Unfold was a first WPF iteration. GraphSquare is a full & pure WPF diagramming library which overrides all previous efforts. Netron and other stuff was up to now freely available for non-commercial purposes. GraphSquare has not been released and is maturing every day, but I am not in a hurry to uncover the code in any way. In any case, at this moment nothing is downloadable on this site.
By Me September 14, 2008 - 10:07 amHi,
By Eric October 21, 2008 - 4:45 pmWe are working on a project which needs a WPF graphic component inside. I’ve read the interesting series of articles written by sukram and your position is close to our development need and philosophy (MVC). Is it possible to use your component inside a commercial application ? Can you contact me. Thanks Regards
Hi,
By Hary October 26, 2008 - 7:53 pmI was doing a search on graph library kit for the .net framework and some search results point to your site. I used to code in java but i realized there are more reusable code in c#.
i am currently a phd student and i have some graph visualizatio code but done in java when i was a master student.
Is it possible to get a copy of the netron library ? this is for academic purpose only. Of course, References will be inserting accordingly.
Thx
[...] the development of GraphSquare (see this article and the architecture series) I needed a flexible mechanism to convert entities and to let the MVC [...]
By Extensibility through Unity : The Orbifold October 26, 2008 - 9:26 pmHi mate,
As others, I’m interested in commerical applications of your framework – could you drop me an e-mail?
Cheers,
By Andrew Stevens November 4, 2008 - 2:39 pmany sample application with source code ?? thx
By kiquenet January 5, 2011 - 12:40 pmKiquenet, G2 is a commercial application and you can download a trial version of it.
By Francois January 7, 2011 - 2:53 pmany similar applications in codeplex ?? thx
By espinete February 3, 2011 - 10:05 pm[...] (Via Orbifold) [...]
By Hierarchical edge bundles « Seeing Complexity February 5, 2011 - 3:58 pm