Interactive graph visualization with gravis

Hi everyone!

I’ve written an open-source package for interactive graph visualization with Python and HTML/CSS/JS called gravis.

It supports python-igraph by accepting its Graph object as input for the provided plotting functions. The output is a Figure object that can be displayed in a web browser (separate window or inline in Jupyter notebook) and exported to a standalone HTML file or a static image (JPG, PNG, SVG). In the browser you can drag around nodes, play with layout algorithms and their parameters, see additional information when hovering over or clicking on an element, and more.

The package and its documenation can be found here:

https://robert-haas.github.io/gravis-docs

The examples in the documentation contain a (preliminary) notebook that demonstrates the combined use of python-igraph and gravis:
https://robert-haas.github.io/gravis-docs/code/examples/external_tools/igraph.html

I hope you find it useful for inspecting your graphs and networks! Feedback of any sorts is always welcome. Please keep in mind that the package is in its beta version, so things may still change slightly in future releases, but you’ll always be able to download any version from PyPI.

3 Likes

Thank you for sharing, this looks really cool!

Pinging @iosonofabio, who has been working on improving visualization in python-igraph through matplotlib, and may be interested in this.

Awesome, thank you!

igraph now supports plotly, which is a similar but more generic idea. I’m a bit busy these days but will take a look ASAP,

Thanks again
Fabio

Hi @roberthaas, would you mind reminding me when your API becomes stable? I’d like to add an example to our gallery (which is now only in the develop branch) to redirect people to your package from our website!

Thanks again for the awesome work

Thank you for the kind words! I’m currently working on a few other packages and non-coding projects, so it might take considerable time until gravis will progress from beta to v1.0. Its current API should be rather stable for a while and I’ve considered releasing it as v1.0, but decided to keep in it beta until I’ve used it myself more in other projects, hopefully collected some user feedback and perhaps refactored the JS parts. So if you’d like to add it to the gallery in its current state that would be awesome, since getting it to a wider audience is part of the plan to improve it. But it’s also perfectly fine to wait until the v1.0 API freeze, I’ll let you know in any case!

One more thing: Of all the examples, the Les Misérables graph is possibly the nicest one currently. It displays images inside of some nodes, uses centrality measures for node and edge sizes, as well as community detection for node colors and positions. It demonstrates those features in all three plotting functions (d3.js, vis.js, 3d-force-graph with three.js), where they appear a bit differently: Les Misérables — gravis 0.1.0 documentation

I think I could quickly adapt the example to use igraph and its algorithms. There’s even a gml file for it available in a tutorial of yours: Generating Cluster Graphs