Harris Consulting Group
Specialists in world class business logistics, analysis and simulation software
    Home       ezyLog       Screen Shots & Reports       eGHIS       Motion Graph       Contact HCG    

Motion Graph


This is an HCG side project to look into Silverlight and data visualisations. The Motion Graph chart is a data visualization used to show a large dataset on one screen in a clear and meaningful way. You can see the current implementation of the Motion Graph here (note this sample requires that Silverlight is installed on your machine)


The problem being solved here is how to show five data dimensions of data on a two dimensional screen, the source data includes:

  • 176 Countries
  • Historical data from 1820 to 2007 (188 years)
  • 5 data points each:
    • Country & Region
    • Year
    • Average annual income
    • Life expectancy at birth
    • Country Population
  • Total of 164,560 data points

The solution is to use:

  • X Axis: Average annual income
  • Y Axis: Life expectancy at birth
  • Colour: Region
  • Popup text: Country name
  • Size: Population
  • Time: Year

The region colour is based on how far to the east of the prime meridian, density is based on how far south the region is from the north pole. The regions are: Europe / Africa, Middle East / West Asia, Asia, East Asia / Oceania, Americas. So Japan and New Zealand are the same colour, but New Zealand is a lighter density.

The web site where I first saw this style of graph on one of the TED talks by Hans Rosling of the Karolinska Institute, where he presented the work done at Gap Minder I was very impressed and assumed that the graphics system behind the graph was some extensive university project that would be hard to reproduce.

When I saw the graph again some months later during a presentation by Tristan Kurniawan (then at SSW) on good user interface design, it occurred to me that this could be done as a Silverlight project. At the time Adam Cogan said "yeah sure Greg, you do that this weekend". While it was clear that it would be a lot more than a weekend job, I started on the project as my "background project", which has took up about 18 Months of background work to complete (say equivalent of three-four months of full time work).

While this work is strongly influenced by the GapMinder project all the code in this version is my own, I draw every pixel on that screen!



Data sources used is from GapMinder.org, specifically see:

The data needed extensive massaging to get the data into a more usable format and to interpolate missing data between known values. See the data tabs on the left hand side of the graph for the raw data I ended up with.

Where data is missing for some years for a country, that data is estimated by drawing a straight line between two known data points, this is then used to derive data for the missing years in between.

The data displayed is not complete and may have errors and omissions, where there was a problem with part of the data set, that was left out rather than represent incorrect data. There was a problem merging separate data sets where countries showed different names, so a direct merge was not possible, in this case if clear merge did not present itself, the data was excluded rather than risk presenting incorrect data.

Other errors may have been introduced into the data during preparation the data for representation in this format (I would welcome someone doing a through data validation / audit).

One of the next tasks for this project is to write an automated extract from the data sources listed above. The spread sheets listed above only had data to 2007 when I started on this project, they now have more recent data, so an automated extract is needed.


Drawing the Graph

The graph is drawn with many lines, circles and rectangles drawn on a Silverlight canvas. With the sheer volume of data and updates needed, this was a bit of a trial and error process to find processes that worked effectively at an acceptable performance.


Gap Minder

If you read Gap Minder's FAQ page you will see the comments: "The software is called Trendalyzer and was sold to Google in 2007. Gapminder has a license to use the software in order to make data freely available to the public. Google have continued on the technology and launched Motion Chart, also available free of charge."
Google's information can be found on their page

To contact HCG, see the contacts page or send an email to