Visualize bipartite graph

Question

Can someone recommend a library or code to visualize bipartite graphs in C#?

Graph# seems not to support this kind of graph directly (but has some support to disentangle vertices).

I want to create some graphic like this bipartite graph with some text in the nodes. Nodes being same width and height would be ideal.

A WPF control would be perfect, as it exists for graph#. Perhaps even a XAML definition exists? As an alternativ: a report window can also be very good.

Probably someone with more experience in Graph# can provide hints on how to do this utilizing Graph#.

Tried around a bit with NodeXL but that seems not to be the perfect solution, as the nodes seems not be that much modifiable. Perhaps someone can provide a better solution. Have played with the NetworkView provided by Soroush. At the moment this comes closest to what I want.

-update- Tried out NetworkView shared by Soroush Falahati. This seems to be a good base, but is not yet that flexible as I need it. I have problems to believe that there is no library out there that can do those things out of the box. (NetworkView has the excellent feature to set connections / edges in the control which gives it an extra boost over the NodeXL). Perhaps Graph# can do even more, but at the moment I just have tried those two.

Answer 1

You can approximate your bipartite graph visualization in NodeXL, and even improve on it by removing edge crossings. I took your sample bipartite graph, and in the image below I colored the nodes by their side (u or v). They are laid out using the Sugiyama algorithm that minimizes edge crossings. I did this in the interactive NodeXL template for Excel 2007--2013, but all these features should be available as the standalone NodeXL C# and WPF class libraries. The current libraries as of this post are available to download here.

I also tried NodeXL's group-in-a-box layout to separate the groups and display them each individually in a grid, with marginal results.

Disclaimer: I'm an advisor for the NodeXL project.

Answer 2

Actually if you could use client side jquery .. iwoul strongly recommend jqPlumbs.. http://www.jsplumb.org/jquery/demo.html

Answer 3

Ok, As you want,

Here is an example/library that let you create graphs and flowcharts easily,

http://www.codeproject.com/Articles/182683/NetworkView-A-WPF-custom-control-for-visualizing-a

It has actually very good features.

Answer 4

1. yFiles WPF is an extensive .NET class library for Windows Presentation Foundation (WPF) applications. Its first-class UI controls for viewing and editing diagrams allow you to automatically arrange complex graphs, diagrams, and networks with the click of a button. Our diagramming library crafted for Windows Forms-based applications is yFiles.NET

2. Graph# is a graph layout framework. It contains some layout algorithms and a GraphLayout control for WPF applications.

3. Using WPF to Visualize a Graph with Circular Dependencies

Answer 5

If you can do it in Windows Forms, you can use NShape. Since the source is available, you could probably port it to WPF if you needed to. It might beat writing it from scratch. Or perhaps you could host a WinForms control to get the functionality you need. Not as nice as a pure WPF solution, though.

Answer 6

D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation

D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document. For example, you can use D3 to generate an HTML table from an array of numbers. Or, use the same data to create an interactive SVG bar chart with smooth transitions and interaction.

D3 is not a monolithic framework that seeks to provide every conceivable feature. Instead, D3 solves the crux of the problem: efficient manipulation of documents based on data. This avoids proprietary representation and affords extraordinary flexibility, exposing the full capabilities of web standards such as CSS3, HTML5 and SVG. With minimal overhead, D3 is extremely fast, supporting large datasets and dynamic behaviors for interaction and animation. D3’s functional style allows code reuse through a diverse collection of components and plugins.

http://d3js.org/

http://mbostock.github.com/d3/talk/20111116/force-collapsible.html