Rank Clocks and Maps: Spatiotemporal Visualisation of Ordered Datasets

Rank Clocks are a type of visualisation invented by Prof Michael Batty here at UCL CASA. They are time-based line charts, wrapped around a clockface – with the start date at the top, wrapping around clockwise to the end date. The lines on the clock show the change in ranking of the items being visualised. By effectively wrapping a line chart around itself, certain patterns, that would be otherwise hard to spot, become clearer.

Starting from Prof Batty’s Rank Clocks application (written in VB), I created a web version that has a subset of the application’s features, but also includes a map, allowing both temporal rank changes, and location, to be shown. A future enhancement would also be to show the change in location with time as well (an example would be how football clubs have moved around in London over the years and how their relative rank in the leagues has also varied) but for now each item in the dataset has just a single point location that remains constant with time.

Live Rank Clock site here.

The “classic” Rank Clock is of New York skyscrapers – looking at the clock allows bursts of skyscraper development to be easily spotted, and as New Yorkers have been building skyscrapers for over a hundred years, and have many of them, it is a rich dataset. I have curated a London equivalent from various sources including Wikipedia. It includes the many residential towerblocks of the 1960s/1970s, many now knocked down, but is not quite the same as New York’s.

The website is written in Javascript, using OpenLayers both for the map (with OpenStreetMap background) and for the rank clock itself. For the rank clock, I am doing some basic trigonmetry to calculate the coordinates needed to show the lines and converting from polar coordinates to “native” screen coordinates. This is a novel but not particularly efficient use of OpenLayers, but I used it as I am quite familiar with using OpenLayers, particularly for showing lines as vectors, rather than using a Javascript vector-based charting API which would be the more obvious choice.

My interpretation of the Rank Clock concept has plenty of flaws – in particular, data can often be easily obscured, and spotting patterns in noisy (frequently changing rank) data is difficult. It’s difficult even to select lines (to see their caption) if other lines are nearby and overlaying them. Nonetheless, it can provide an unusual way of looking at some interesting datasets.

For one of the datasets in the sample website (US baby names) I have repurposed the map to effectively show a 2D graph indicating beginning and ending (in time) positions of the names – so here OpenLayers is being used to show two “maps” – but neither are actually maps.

I’ve also linked into the Google Earth browser plugin (installation maybe be required), replacing each dot on the OpenStreetMap map, with a column of varying height (and colour) based on the initial rank, with an extent appropriate to the data set. Google Earth can be refreshed by supplying new KML information – and it turns out that OpenLayers has a rather nice KML conversion and export feature for any geometry in it, which allows Google Earth to be driven in this way. This is done when clicking on a Rank Clock line, allowing the equivalent feature in Google Earth to be redrawn with a thicker border. Unfortuantely events cannot be captured from Google Earth and back into the OpenLayers map, so clicking on a pillar in the former will not highlight the corresponding Rank Clock line in the latter. Still, it’s a nice way of linking spatialtemporal information and then visualising it in 3D.

I carried this work out quite a while ago, but haven’t mentioned it to now, as it’s not complete. There are only a limited number of datasets available, and plenty more features could be added – and the navigation and interaction improved significantly. Please bear this in mind when viewing the live site.

There are a few “toy” features already though – you can invert the rank clock (normally the top-ranked items are in the middle of the circle and so are hard to see), change the metric the colour is showing, and filter and relayer.

The three rank clocks shown here are showing: TOP – Changes in population of the London Boroughs of Newham and Tower Hamlets, and the City of London, over 150 years. The City of London line spirals outwards, showing its drop in population (and so rank). Tower Hamlets also shows a big drop in rank during WWII, but has started to increase again recently. Westminster’s population rank has steadily increased, until WWII – but again its rank has also more recently increased. MIDDLE – Tall buildings in London, coloured by year they were built. The oldest (red) buildings have been selected and show in Google Earth, showing that such buildings were entirely in the centre and west of London. BOTTOM – US company revenue. The San-Francisco-headquartered companies are selected on the map and correspondingly highlighted on the rank clock, showing that only one was founded before the 1970s – IBM – and a general spiralling inwards as Silicon Valley grows.

Live Rank Clock site here.

Reworking Booth: Geodemographics of Housing

I’ve created a new visualisation, a dasymetric map of housing demographics which you can see here, which attempts to improve on the common thematic (a.k.a. choropleth) maps – a traditional example is shown below – where areas across the country are colour-coded according to some attribute. My visualisation clips the colour-coding to the building outlines in each area, leaving open ground, parks etc uncoloured.

The Traditional Approach

The shortcoming of choropleth maps is that each area is coloured uniformly. If the attribute being measured is a property of the houses in that area, such as much of the census data, then choropleth maps not only colour the houses in each area, but also the parks, rivers and mountains that might also be contained within the area, even though the data being displayed arguably only applies to the houses. This means that geodemographic classification results that predominate in rural areas tend to overwhelm a map at smaller scales – as can be seen in the map on the right – where the green represents a countryside geodemographic.

An alternative to choropleth maps is to use cartograms. These distort the area, elastically, to tessellating hexagonal groups or to circles (Dorling cartograms), to match typically population rather than geographic extent, so that the colours are represented more fairly, but cartograms are very difficult for most people to interpret and relate to familiar physical features. They can look very “alien”. One further alternative is dot distribution maps – these assign dots of colour, randomly within each area. This reduces the colour density correctly in sparsely populated areas, but distributes the dots evenly across empty parks and rows of houses, if both are in a single area, and imply single points of population.

Clipping the Choropleth Maps

My visualisation attempts be the best of both worlds, by retaining the familiar geographic shape of the UK and its towns and cities, but not swamping the map with colours in all areas, and indeed ensuring that unpopulated areas have no colour. This is possible because Ordnance Survey Open Data includes Vector Map District. The second release of this dataset improved the quality of building outlines considerably, allowing distinct rows of buildings on streets to be seen and even individual detached houses. Unfortunately building classifications are not included, so the process necessarily colours all buildings, rather than just the residential ones that formed part of the census data. This is why, for example, the Millennium Dome in Greenwich appears, even though no one (hopefully!) lives there.

The major shortcoming of doing this is that it falsely implies a higher level of precision within each Output Area, by often showing and colouring individual buildings, whereas the colour is representative as an average of the properties in the area concerned, rather than telling you something about that particular building itself. That is, the technique is showing no new or more detailed data than can be seen in the traditional choropleth maps, but tends to mislead the viewer otherwise. This is balanced by making the map seem more realistic, by not unformly covering everything in the area with a giant blob of a single colour.

The map can be considered to be a dasymetric map, albeit one where the spatial qualifier, population density, is one of two values – high (in a building) or zero (not in a building).

Booth’s Poverty Map

An inspiration for this kind of map is the Charles Booth Poverty Map of 1898-9, although my example is considerably less sophisticated. For this map, Booth (and his assistants) visited every house, to determine the demographic of the house, and then painstakingly coloured in the houses, along the streets. His map therefore did not suffer from the falsely implied accuracy – his map really was as accurate as it looks. The Museum of London, incidentally, has a “walk in” Booth poverty map, I featured it on Mapping London blog last year.

The photo above compares Booth’s map (from a photo of the map in the Museum exhibition, including a friend’s hand) with my map, for the Hackney area in London.

OAC, IMD and London

My main geodemographic map is showing the OAC (Output Area Classification), which was created by Dan Vickers in Sheffield in 2005, and is based on data from the 2001 census. The areas used are Output Areas, there are around 210,000 of them in the UK, each one with a population of roughly 250 people in 2001.

The OAC map is not particularly illuminating for London – the capital is considerably more ethnically diverse than most other parts of the country, but because the clustering process used to create OAC is run across the whole country uniformly, only one Supergroup appears to show such ethnically diverse areas – “7″ (Multicultural), rather than showing the variety within this group that extends across the capital. With this in mind I have created an alternative map, which colours the housing according to the IMD (Index of Multiple Deprivation) rankings. This covers England only, and the data is only available at larger spatial units, called LSOAs (Lower Super Output Areas) but is more up-to-date, being from 2010, and shows considerable more variety across London. Use the link at the bottom of the visualisation to switch between the two.

You can view the map here. It uses geolocation to attempt to zoom to your local area, if you allow it to – it will probably ask you to allow this when you visit the site.

Tube Colours

Transport for London (TfL) take their colours extremely seriously – the London Underground, in particularly, uses colour extensively to brand each line, and the maps and liveries are very well known.

The organisation has a colour guide to ensure that, when referencing the tube lines, the correct colour is used. Somewhat surprisingly, the guide includes hexadecimal (i.e. web) colours for only a “safe” palette – i.e. colours which would definitely work in very old web browsers. They don’t list the “true” hexadecimal for the colours, even though, confusingly, the colour shown is the true one. I couldn’t find anywhere on the web that did this either, all in one place, so here below is a summary. I’ve also included the safe colours so you can see the difference – but don’t use these unless you have to.

Line True Hexadecimal Web Safe Hexadecimal
Bakerloo #B36305 #996633
Central #E32017 #CC3333
Circle #FFD300 #FFCC00
District #00782A #006633
Hammersmith and City #F3A9BB #CC9999
Jubilee #A0A5A9 #868F98
Metropolitan #9B0056 #660066
Northern #000000 #000000
Piccadilly #003688 #000099
Victoria #0098D4 #0099CC
Waterloo and City #95CDBA #66CCCC
DLR #00A4A7 #009999
Overground #EE7C0E #FF6600
Tramlink #84B817 #66CC00

Mappiness – A Personal Mood Map

The Mappiness project is run by one of CASA’s technology superstars Dr George MacKerron – it was his Ph.D project at LSE. The project, which is still going, aims to quantify happiness based on environmental factors, such as location, views and sound, as well as who people are with and what they are doing. Data is collected by volunteers downloading an iPhone app, which then pings them at random moments twice a day between 8am and 11pm (configurable) to ask them the questions and collect the data. Volunteer incentive is driven by having access to a personal webpage which contains all their collected data, visualised in a wealth of attractive graphs and maps.

I’ve been using the app since late October, it has been steadily pinging me twice a day since then, and most of the time I hear the familiar ‘ding ding’ and get around to recording the information. With around 160 responses, some interesting insights are now appearing, some(!) of which are non-personal enough to share here. The map above shows the locations where I was pinged, for the London area – yellow stars indicate where a photo was taken.

Here’s one, based on the general environment:

Perhaps more interesting is that I spend much less time outdoors than I thought. The app (by default) only asks for a picture if you are outdoors, so by counting the number of pictures that appear on my personal webpage – just 14 out of 161 – this in theory means that I spend only 8-9% of my waking life outside. This percentage will hopefully grow as summer approaches and things start to warm up again.

Because I don’t get to choose when to post the images, the photos are a good snapshot of my “everyday” outdoor view, rather than a nice or interesting place that I would specifically stop to photograph. Here’s a couple of my most recent ones:

One of Dr MacKerron’s current projects involves using Microsoft Kinect sensors for visualisation – this is my very tenuous link to allow me to post the image below, which is a 3D grid “photograph” of me at my desk, constructed from Kinect data.

Mappiness managed to choose to ping me this morning precisely at the moment that my bike chain snapped, on the way to work. Needless to say, a low score for happiness was recorded.

Map background Copyright Google.

Bike Share Route Fluxes

Capital Bikeshare, the bike sharing system for Washington DC and Arlington, recently released the data on their first 1.3 million journeys. Boston’s Hubway bike sharing system also released journey data for around 5000 journeys across an October weekend, as part of a visualisation competition. Both these data releases sit alongside London’s Barclays Cycle Hire scheme, which also released data on around 3.2 million journeys made during the first part of last year.

Taking together all these data sets, I’ve used Routino and OpenStreetMap data to suggest likely routes taken for each recorded journey. This same set of data was used for Martin Zaltz Austwick’s excellent animation of bikes going around London streets. I’ve then built another set of data, an node/edge list, showing how many bike sharing bikes have probably travelled along each section of road. Finally, I’ve used node/edge visualiser Gephi and its Geo Layout plugin to visualise the sets of edges. The resulting maps here are presented below without embellishment, contextual information, scale or legend (for which I apologise – unfortunately this isn’t my current primary work focus so my time on it is restricted.)

For the two American schemes featured here, I have set the Routino profiler to not use trunk roads. Unlike most UK trunk roads, American trunk roads (“freeways”?) appear to be almost as big as our motorways, and I expect you wouldn’t find bikes on them. Unfortunately there are some gaps in the Washington DC data, which does show some cycle-lane bridges alongside such freeways, but these aren’t always connected to roads at either end or to other parts of the cycle network, so my router doesn’t discover them. This means that only a few crossings between Virginia and Washington DC are shown, whereas actually more direct ones are likely to be also in use. The profile also over-rewards cycleways – yes these are popular but probably not quite as popular as the distinctive one in the centre of Washington DC (15th Street North West) showing up as a very fat red line, suggests. The highlighting of other errors in the comments on this post is welcomed, I may optimise the profiler (or even edit OpenStreetMap a bit, if appropriate) and have another shot.

London:

Washington DC:

Boston:

Run Every Street in Edinburgh – in Strict Alphabetical Order

…it sounds like one heck of a lot of running. But Murray Strain, one of Scotland’s top terrain runners, is counting on it for his basic training. He’s logging the whole venture, which is based on his trusty Edinburgh A-Z. If two adjacent streets with very similar names are nonetheless separated in the A-Z index by one on the far side of the city, it means a couple of legs right across the city.

Since he started the exercise last year Murray’s got through all the As, and is currently midway through the Bs. I’ve produce a couple of GEMMA maps, one showing the A-Bs (above, As are red and Bs are orange) and one showing the A-Gs (below, in rainbow order). That’s a lot of streets. N.B. The maps in fact show all linear features in the area in OpenStreetMap, so the odd named cycleway and waterway has crept in there too. But the ~95% of the coloured lines will be the streets that Murray will be run.

In order to produce the map, I’ve added a new feature to GEMMA – it now allows you specify only one desired geometry type, i.e. points, lines OR polygons, when adding an OpenStreetMap layer to your map. Previously, you got all three types, although you could reduce each to a dot if desired. This example also highlights the need for legends on the PDF maps that GEMMA produces – a larger coding change, so one that would make it into a future version 2 of GEMMA.

A Glimpse of Bike Share Geographies Around the World

[Update - now including a much larger version.] Below is the image I submitted to this year’s UCL Research Images as Art exhibition. You can see it, and around 300 other entries, in the South Cloisters on the UCL campus in central London, for the next few days. A larger version can be viewed here. The image purposely has no explanatory text as it is intended as a piece of “infogeographic art” rather than as a map. It is derived from the dots for the various cities on my bike share map.

It shows the “footprint” of the docking stations making up 49 bike share systems around the world. The colours represent the empty/full state of each docking station at the particular moment in time when the image was made. The numbers show the total number of docking points – each docking station being made up of one or more docking points, each of which may or may not have a bike currently parked in it.

The geographies and topographies of the cities themselves inform the shape of the systems – particularly coastal cities (e.g. Nice, Rio, Barcelona, Miami Beach) and ones with large lakes mountains near their centres (e.g. Montreal).

A subtle but important point on the scaling: The scales of the systems (i.e. each system footprint and the spacing between docking stations) are roughly comparable – they actually vary by the cosine of the latitude – these means that the more tropical systems, e.g. Mexico City’s, appear to be up to ~20% smaller than they actually are, relative to the majority which are generally at temperate latitudes. However, the sizes of the circles themselves are directly comparable across all the systems, i.e each pixel on the graphic represents an equal number of docking points, regardless of which system it is in.

Massive Christmas Day for Boris Bikes

Christmas Day this year recorded far and away the highest ever simultaneous usage of the Barclays Cycle Hire bikes, aka the Boris Bikes, probably meaning it was the biggest number of hires in a single day too. The lack of any Christmas Day tube or bus service in the capital is the obvious reason for the huge usage spike. Previous popular days for the were the four tube strikes in late 2010. Both these events can be seen in the graph above. There is a diamond for each day, showing the difference between the maximum number of bikes available at a point in the day (typically at around 3am), and the minimum available (typically around 4pm for weekends or 9am/6pm for weekdays). Christmas Day was the big jump on the far right of the graph. The jump is much bigger than for Christmas Day 2010, as that day was pretty cold and snowy and only especially hardened tourists would be using the bikes then.

The top days are (measured by maximum closed-system simultaneous usage, i.e. maximum number of Boris Bikes out of the docks and rolling around the streets in a single moment, assuming no removal or addition by the operator that day):

  • Sunday 25 December 2011 – 2065 (Christmas Day – no tubes or buses)
  • Sunday 2 October 2011 – 1795 (Late summer heatwave)
  • Thursday 3 February 2011 – 1791 (?)
  • Tuesday 15 March 2011 – 1649 (Likely false result – mass removal)
  • Saturday 1 October 2011 – 1627 (Late summer heatwave)

Actual total usage on each day is likely to be roughly proportional, and typically ~20 times the above numbers.

Note – please don’t read too much into the lowest usage days that appear on the graph. We’ve had quite a few power problems with our server room this year, and such low days may simply be when we were able to record little if any data. Large-scale bike removals and additions by the operator can also distort the results quite a bit, by perhaps up to 500 bikes a day. Mass additions to the system will depress the true result for that day, while mass removals can falsely inflate the numbers. It’s difficult to spot these, except by looking at the graph for the previous and following days, and comparing the max/min numbers.

Bike Share Map Update – 6 New Cities, Weather, Stats

Now available on the Bike Share Map are five extra French cities: Montpellier, St Etienne, Calais, Valence and Vannes, as well as Kunshan in China. I’m also now showing the relaunched bike share in Rio de Janeiro – yes, you can #bikeshare beside Copacabana Beach. This brings the total currently being visualised to 45 – not including several that have shut down for the winter and will be back, and some others where I’ve been asked not to collect the data. Thanks to Russell from the Bike-sharing Blog for the tip-offs for all of these.

So far, Montpellier, Rio and Kunshan are looking potentially very interesting, while there’s nothing much going on in Calais, St Etienne, Valence or Vannes.

I’ve also added some extra stats on each bike share, showing the number of docks and how many are completely empty and completely full – often surprisingly many after rush-hour for certain cities.

Finally and perhaps most importantly I’m now showing current weather conditions for most of the cities. The data is the METAR information for the major airport nearest each city, supplied and decoded by the NOAA Internet Weather Source. I’m picking up the reports every hour or so (some report less frequently) and caching them. Hopefully they will prove accurate. Currently it’s reporting 0°C in Toronto and 27°C in Rio de Janeiro.

Don’t Zone-1 It When You Can Boris Bike It

[Updated with new connections.] Ever thought what the tube network would look like if you took out the expensive Zone 1? Me neither, until this morning, when I was wondering if it was possible to utilise my current “Boris Bike” bikeshare 24-hour membership to save a bit of money on commuting in to work.

Transport for London would really rather you didn’t take the tube into Zone 1. It’s often at capacity during the rush hour. The fares are priced accordingly – for example, to get a tube from Zone 3 to Zone 1, it costs £2.90 during the Peak Fare periods, compared with £1.40 if you only go from Zone 3 to Zone 2. Do that commute twice, and it’s a £3 saving missing out Zone 1, which more than makes up for the £1 Boris Bike 24-hour membership charge. So, I was wondering if it is viable to get off the tube a few stops early and Boris Bike the final mile or so.

Superimposing my London bike share map reveals directions from where such money-saving journeys may be possible. Plenty of opportunities from the north-west or the west, with St John’s Wood, Notting Hill and Earls Court having easy Boris Bike accessibility. Access from the south-west and south is also good, thanks to Vauxhall and Elephant & Castle. Things get a little trickier – as usual – in the south-east, where a 1km walk from Bermondsey, or a much longer walk from South Bermondsey are your only options – the region won’t even stand to benefit from the forthcoming scheme expansion. The east is also an option, with Whitechapel being very well stocked with Boris Bikes, and Wapping not being too far either. The east is set to benefit too from the imminent expansion of the Barclays Cycle Hire scheme, to use its full name, to cover all of Tower Hamlets. The north-east is OK, with Hoxton an option, although it’s a shame the docks don’t extend up to Highbury & Islington station, a major interchange. The north is also good, thanks to the legendary Mornington Crescent station.

Four of the Best Zone 2 & Bike Opportunities

  • Mornington Crescent (Northern Line) – right beside a big docking station. Don’t go to Euston (Zone 1). It’s also easy to get to Mornington Crescent from the Overground, thanks to an unmarked but official Out of Station Interchange.
  • Notting Hill Gate (Central Line) – the tube takes you to the top of the hill, then go east by Boris Bike.
  • Earl’s Court (District/Piccadilly) – it’s a long way to Charing Cross, but if you don’t need to go that far, the bike is a good way to travel.
  • Whitechapel (District/Hammersmith & City) – two big stands very close to the station, and an easy cycle along CS2 into the City.

So, all in all, not too bad. Whether it’s worth the extra time walking to a convenient docking station, and the worry of finding it all out of bikes, to save a pound or two, is another thing…

+ =

See my Mapping London article for more detail about the No Zone 1 map. You can click on the map above for a larger version. An SVG version (i.e. editable) without the bike docking stations, is downloadable here although there is lots of missing detail beyond Zone 2.

The map was based on a Wikimedia/Wikipedia file, which I then augmented (to show the Overground and some selected regular railway lines) with OpenStreetMap data, by producing a map in GEMMA of railway=rail features. I also added some unmarked Out of Station Interchanges, thanks to this FOI request. Photos by Gnatallica, Clotheyes and Wwarby on Flickr.

[Update: An earlier version of the article and map made reference to Shoreditch High Street station which I incorrectly thought was in Zone 2 for "old East London Line" journeys - it appears this is not actually the case - the anomaly that I was misremembering is that for short journeys from the station, the Peak Fare increases do not apply. I've also updated the map a few times since posting this article, to add in a few missing stations and also the locations of the big terminus stations in London. I've also added some "Out of Station Interchanges" on the Overground - many of these aren't marked on official TfL maps, but are valid interchanges, i.e. you don't get charged for two journeys.]