Skip down to main content

Existing tools and OII InteractiveVis approach

Published on
8 Aug 2012
Written by
Scott A. Hale

From the beginning of this project, we have been keen to build upon the best of the existing tools and not “reinvent the wheel.” At the same time, however, we have set ourselves some unique parameters to allow the widest use of visualizations produced with the tools we develop. In particular, we want our visualizations to be native HTML5 visualizations, run as standalone / offline visualizations, work on tablets and other touch-screen interfaces. At the same time, we want to make the process of going from datafile to visualization as easy and accessible as possible. We feel confident this combination of factors isn’t available yet, but there are some existing building blocks we can use. This blog post will look at each of the parameters mentioned above and then turn to look at existing visualization tools (Many Eyes, Google Charts, Simile Widgets) and libraries (Sigma.js, D3, Miso, Raphael).


First, we wanted to use only native web technologies. While Java, Flash, and other technologies are powerful (and currently more common) ways to show and present data, these technologies require plugins that not all devices support. In particular, the Apple iPhone and iPad have not supported Flash since their launch, while Adobe will halt new installations of Flash on Android devices and will not support Flash for the newest version of Android. Tablets and phones, however, could be a great medium to explore data interactively with touch. These devices, along with desktop computers running modern web browsers, support web technologies (HTML5, CSS, HTML, SVG, Canvas) that can allow a rich, cross-platform experience for interactive visualization.

More than just running in a web browser, however, these technologies power the newest, emerging ebook formats. So, visualizations developed with native web technologies should also be compatable with ebook formats once ebook reading applications implement the newest standards. To be the most versatile, however, visualizations should be entirely self contained so that once downloaded (or bundled with an ebook) they can work even when the device is offline.

Finally, and most importantly for this project, we want to simplify the process of creating these visualization by allowing the creation and customization of the visualization in a standard web browser.

Existing tools and libraries

All of the existing tools we know of lack at least one of the three parameters above. Many Eyes, for instance, relies on Java and StatPlanet uses Flash. While Google Charts and Google Maps use native web technologies, they require an active Internet connection.

Finally, there are some libraries that use native web technologies and work offline, but these currently require the creator of a visualization to be able to know some programming or scripting languages. Among the emerging libraries are three that this project is actively building upon: Sigma.js, Raphael, and Miso. Each of these and some of the alternatives will be detailed in subsequent blogs posts with prototype visualizations.

On the horizon

While our project aims to move from datafile to interactive visualization online, there is still a lot of preprocessing to get data into the correct format. For network data, this will often involve desktop programs or scripting languages for data capture and layout (Gephi, NodeXL, R). While many of these desktop tools will always be necessary, there are some workflows that could be executed entirely within a web browser. 140kit by OII MSc student Devin Gaffney aims to ease the collecting of data from Twitter, while a proposal by the authors of Gephi aims to allow network layout in the browser as well. Additionally, work by project member Joshua Melville and his supervisor Dr. Bernie Hogan has resulted NameGen, a Facebook application which exports network data in common file formats and uses Gephi and Sigma.js to layout and render Facebook ego-networks entirely in the browser.