Note while the package renderer (your last link) is impressively fast, it's only a renderer. It consumes a graph that has already been laid out; layout is computationally more expensive than just rendering it. (It can also work with a layout, but that won't scale in real time to those Internet-wide graphs.)
For layout I have found nothing faster than mars https://github.com/marckhoury/mars. I have to work with graphs of hundreds of millions of nodes. Just looking at fragments of them of tens of thousands of nodes in reasonable time requires something like mars. I have not found anything else remotely as scalable.
Hi lmeyerov, I'll reach out by emailing you on GitHub or via graphistry. Unfortunately, I won't be able to use anything proprietary in production. Also I need solutions that are self contained executables and capable of scaling to several billion nodes. External APIs are a no-go. That said I'm happy to talk as it looks like y'all are doing cool things :)
This also also very nice list of Graph libraries done by the NGraph author. The best part of it is, that you can test each of the libraries with various types of graphs and sizes (both configurable):
Hi Jedisct1, any chance you know the dataset and performance numbers for the "proof" benchmark? Would love to show why we switched to a GPU cloud architecture :)
I agree this has all the info I'd expect right on the initial page and looks pretty.
Small typo in case the author reads this:
"""
Sigma is a JavaScript library dedicated to graph drawing. It makes easy to publish networks on Web pages, and allows developers to integrate network exploration in rich Web applications.
"""
Should be "It makes it easy to publish" (missing it) or something similar (I'm not a native speaker).
Maybe just "It simplifies the publishing of networks on Web pages [...]"
It's pretty heavy but on the other hand they pretty much cover every use case you would be able to think of within its own API. For that it's kind of nice.
The title of this item is a bit misleading imo, as 'drawing' can mean a bit more than 'visualization', such as layout (node placement and edge routing) as you imply. Without intending to minimize the importance of design, presentation, and api, graph layout algorithm implementation can be quiet involved, which is why you see them rarely, imo.
I like it for what it is (very small footprint @ 84kb!) But it doesn't do much more than what you see on the homepage, and the project looks barely active. Last release on Aug 22, 2014, and no commits to the core JS for some time.
If you're looking for much more fully-featured graph drawing that's been actively developed for years, have a look at GoJS (http://gojs.net). Canvas diagrams with a focus on interactivity (text editing/undo/etc), layouts, data-binding, and presentation.
Big disclaimer: I'm a lead dev for GoJS and while it packs a huge amount of functionality, it's a commercial JS Library.
It's useful to bucket these in magnitudes for the ability to run both layout and rendering. D3 is great up to ~5000 elements, sigma is probably the best open source and reaches up to ~50K (?). And, shameless plug, we've focused on bigger ones, and regularly do 1MM :) (See PyGraphistry link above.)
For smaller graphs, the focus is generally more on styling, like SVG, so D3 is probably better.
Larger graphs are used in analytic workloads like machine learning, network operations, etc. The emphasis is more on the ability to see big graphs (requiring smart rendering and layout), bind algorithm results to the visual encoding, and drill down. D3 and pure rendering libraries become a bit too low-level and clunky at this point.
For 10-100X more data (and more of a focus on batteries-included data exploration), we've been building https://github.com/graphistry/pygraphistry that leverages GPGPU tech. Ping for an alpha API key :)
Not to detract from Sigma: it's a great project, and impressive for open source here!
I tried using it for one of my projects, but the feature support is very little, and I had to actually manually draw the nodes.
Reverted back to using D3.js, which, though having a high learning curve, gracefully solved my problem.
What's the best JavaScript library for visually representing, animating, and interacting with general data structures, such as various tree and hash algorithms?
I tried to use JsPlumb and it was a nightmare. I think there is a lot of documentation for JsPlumb, but it's structured so poorly that it makes it hard to use. I'm pretty sure I had an unpleasant experience with JsPlumb mostly because the framework behaves much differently than what the documentation suggests.
You should still check it out though. It might work for you.
I used an older (~ 2yr) version of sigma in a case where D3 couldn't hack it. There were 10's of thousands of nodes, and D3's approach of SVG elements were not as efficient as the sigma.js canvas approach. my needs were minimal though, so none of the extra d3 features came into play (and this was also before sigma had plugins).
to lay out the graph i was running dot from graphviz on the server. took too long client-side.
I'd say D3 is a super set of the features in SigmaJS. D3 is more comprehensive in the sense that there are so many types of visualizations you can make using just D3.
For my use case to display an interactive graph with thousands of connected nodes on smartphones in a web app, no available graph library was fast enough. Sigma.js, VivaGraph, D3 based ones, etc. are all way to slow. WebGL hadn't good support on mobile devices 2 years ago.
I ended up coding a terse JS library (20kb) with a Canvas and SVG renderer and physics simulation that runs on 60fps.
- https://github.com/anvaka/ngraph.pixel
- https://github.com/anvaka/VivaGraphJS
and for large graphs:
- https://github.com/anvaka/pm
with a pretty impressive example, displaying the whole internet (BGP adjacencies):
http://as2914.net/