Specification - Graph Visualization on the web

From Gephi:Wiki
Jump to: navigation, search

Communication about (large) graphs is currently limited because it’s not easy to put them on the web. Graph visualization has very much same aims as other types of visualization and need powerful web support. Creating an efficient, interactive and portable library for doing that is an important challenge.

The Gephi team sees this a new project, and is looking for partners to specify and implement it. Let's share needs and resources!

Specifications

The idea is simple. People uses desktop softwares or scripts to visualize, manipulate and analyze large networks. Then, they would like to communicate about their findings and export the visualization on the web. There is currently no standard library that would do this job with graph larger than couple of thousands elements. Minimum interactivity should also be provided: zoom, pan, and mouse over events.

  • Display large graphs on the web using WebGL, over 10 000 elements (nodes + edges).
  • Display graphs, no diagram. That means only nodes, edges and labels.
  • Works on all modern browsers.
  • The data can be loaded with a standard format, 'GraphML' for example.
  • Zoom and Pan.
  • Mouse over on nodes and edges.
  • A well-designed API to use and reuse the library.
  • Full-screen mode? (proposed by Julian, inspired by X3DOM examples)
  • CSS-skinnable, eg. being able to change the size, background color, without calling lot of API functions? (proposed by Julian, inspired by X3DOM too. I'll stop there :))
  • Work nicely with other technologies like SVG, Canvas, JQuery, Ext JS, Dojo, GWT..? (proposed by Julian)

See Forum Topic for links and resources.

Technologies

Collecting resources, links and ideas about the libraries or techniques that could be used.

Many information on this forum topic.

Most of existing solutions fails to render graphs over 2000 nodes. That's why we came with the early conclusion it will have to be hardware accelerated, either directly using WebGL or through a library that would profit from hardware acceleration. Back on the desktop, the use of OpenGL has already showed great improvements in responsiveness compared to 2D-based libraries.

We believe that without optimizing much, one could display graphs over 10000 elements (nodes + edges) at 30 FPS just by using WebGL.

As explained in the forum topic, using WebGL means going to a lower-level than using an existing library, so it requires more effort, but one can expect great performance.

Project

The project is in its discussion stage. We collect resources and define an early stage of specifications. The idea is to define a direction and propose to anyone interested in the same goals to gather and work together. The only aim is to build a standard library for displaying large graphs on the web.

The Gephi consortium will have some resources to help implementing it but not enough to do all the job. One of the solution will be to propose this project for the next Google Summer of Code, where Gephi has been already selected in 2009 and 2010. If Gephi is part again of the 2011 program, that would secure a skilled student for the summer.

Existing solutions

GexfWalker

Small open-source Flash widget to explore the GEXF-encoded graphs locally as globally. Code available on Github.

More information can be found on this forum section.

And also Display geocoded graphs with GexfWalker

Seadragon

The Gephi team built a small Gephi plug-in to export a graph image as a zoomable HTML+JS interface using the Seadragon library. All details can be found on this blog article, as well as how to download and test the plug-in in Gephi.

Linkfluence

Flash-based widget for drawing network maps. Proprietary, but excellent source of inspiration. Example of use can be found on their website us.linkfluence.net

Others

collected from Graph visualization code in javascript?

Links