score:9

Accepted answer

My understanding: Gephi doesn't do well with real-time updates; it's usually used on static data.

One major consideration - what is the visualization you wish to present? Is it a directed graph? Cyclic? Weighted? Additional labels?

Some toolkits are 'fixed' in what they can display, but make it easy to present a graph. Others (like d3) are very extensible, so you could create just about anything.

For the purposes of the StackOverflow format, you might get better answers if you can pin down the limitations and needs of your system (actual data rate, thin/thick client, type of viz, etc)

score:7

I think D3 is great, however, recently, there was a talk on Sigma.js at FOSDEM, explaing that is scales better for bigger graphs. See also http://thewhyaxis.info/hairball/

score:9

check out vivagraph which uses webgl for the rendering and scales really well also for larger networks. They have some nice examples for really large ones (FB, Amazon).

http://github.com/anvaka/VivaGraphJS

score:14

There's not a silver bullet solution for this kind of problem and most depends from what you have in mind to do, the team and the budget (of money and time) you have.

I wouldn't recommend you D3, unless you have to met one of the following:

  • you want to create a brand new way to visualize your data
  • you have skilled people in your team - that can be you - with D3
  • you have already other D3 widgets/viz to integrate

If you don't met any of the entries above I would put D3 on a side, and tell you to have a look at:

  • SigmaJS, Open Source and free Javascript library.
  • KeyLines, Commercial Javascript Toolkit.
  • VivaGraphJS, Open Source and free JS library.

Disclaimer: I'm one of the KeyLines developers.

Depending on the size of the data you have, the choice of the library can change: if you plan to have no more than 3/400 nodes on your chart and not need particular styling/animations then SigmaJS I think is more than fine; if you're looking for something more advanced for styling or animation I would recommend KeyLines, because it is designed to handle this kind of situations (providing an incremental layout) and it does scale up to 2000 nodes with no problems - although I might suggest to have a filter on a side with this size.

I would name VivaGraph as last resort: SigmaJS has a WebGL renderer as well and provide a much nicer rendering IMHO.
VivaGraphJS will be soon replaced with ngraph that will use an agnostic aproach for renders: you can use PIXI, Fabric or whatever you want....

Using a WebGL renderer makes sense when you load your assets once and reuse them all the time: if you're styling your chart elements in a real-time scenario there's not advantage on Canvas IMHO.


Related Query