Michael Bell

Ph.D. Students Blog

Skip to: Content | Sidebar | Footer

Producing web-based dynamic graphs

5 August, 2011 (13:05) | Sentence reuse, Uncategorized, Website | By: mj_bell

As part of my work on sentence reuse I have been investigating ways to visualise various sets of data on my website. An obvious requirement of this is that the graphs must be developed dynamically; the resulting graph depending on a users query. We also have to account for various types of data, not just numerical data. For example, we want to produce a graph that shows, for each database version, which entry (or entries) a given sentence occurs in. Below is an early mock-up of such a graph in R, illustrating this example:

Graph showing accessions a sentence occurs in, over time

From this graph we can see that for the given sentence, it initially only occurs in two database entries, before propagating through the database. We can also see in some instances where it has been removed from an entry and then reappearing in a later version. This current view has a number of issues, with perhaps the main issue being it isn’t always clear which point corresponds to a database entry and accession number. The mock-up also doesn’t make it clear which entries come from TrEMBL and which are Swiss-Prot, whilst the labels should also be more meaningful (release dates on the Y axis and actual accession numbers on X axis).

A range of tools looking to meet these requirements were tried and tested, including:

A number of issues were identified with most approaches. These included:

  • The majority of approaches made use of the canvas element, which isn’t supported by Internet Explorer (without using additional scripts)
  • Reliance on a third party server (couldn’t run all code locally)
  • No ability to handle non-numeric data types
  • Problems with licencing

We opted to use the HighCharts project for our charts, as it appeared to meet our full requirements. Benefits of HighCharts are that it is open source, provides numerous chart types, ability to zoom sections of a graph, ability to display tooltip text and the ability to export and save graphs. As an example, we have produced a graph similar to the one above, this time dynamically created in HighCharts:

Example graph from website showing accessions a sentence occurs in, over time

As can be seen, it overcomes some of the drawbacks of the previous approach. TrEMBL entries are clearly visible in red, whilst Swiss-Prot entries are in blue. The axis labels are also more meaningful and we can hover over any point to get a tool-tip, clearly identifying which accession number and version it relates to. Data points are also click-able, providing links to further information, whilst you can also zoom into areas of the graph.

The production of these graphs is part of an overall view we are producing to allow information about sentence reuse in UniProtKB to be analysed and browsed. We will blog about further developments in future posts.

Write a comment