General Election Swings Visualisation

I’ve created a visualisation of the results from the UK general election this month. By default, it shows the most significant swings between parties, for each constituency. By using the options on the right, you can change it to show simple vote counts, overall results, or swings between any two significant parties. I’m using a circle to represent each constituency. The area of the circle is directly proportional to the metric being shown (number of votes, or percentage point swing) with a dynamic key on the right to help out. Click on a circle to see the vote results.

Some Notes:

By choosing “Winning Party” from the “Other” drop down, you see the simplest map – each circle is the same size, and it simply shows the winning results – with the previous winner shown as the colour on the edge of the circle. I think this kind of view is a “best of both worlds” approach – as long as the circles don’t overlap, it has the “fairness” of cartograms (aka “proportional” maps in the BBC’s coverage) while retaining the geographical familiarity of the choropleth (“normal”) map of the UK.

Only Great Britain is included, not Northern Ireland, as the OS Open Data release, which provides the parliamentary boundaries from which the centroids were calculated for the circle locations, does not at the moment include Northern Ireland.

The definition of swing is tricky – swing can only be described as being from one party to another. Choosing which two parties to use for the “headline” swing was tricky. In the end, I’ve chosen to show the swing between the losing and winning party where the seat changed hands, and where it didn’t, the swing between the two parties with the highest number of votes. This means “interesting” swings like in Bethnal Green & Bow are still included. It does however mean that the largest swing is not necessarily shown.

There were a large number of parties contesting seats – in the end I’ve only included parties that got at least 30,000 votes in total, to prevent the lists becoming too long. I’ve also excluded swings where either party in the swing had less than 5% of the vote (i.e. losing their deposit) as such a swing is probably not very meaningful.

In general, a swing between a “small” party and a “large” party is not meaningful anyway, because any voting changes that a large party suffers/gains from are probably to/from another large party, rather than to/from the small party. So, bear this in mind when viewing the swings between (for example) Labour and UKIP. UKIP appears to have gained almost everywhere but actually it was probably another “large” party (Conservatives or Liberal Democrats) that actually got the floating votes.

The background imagery was custom-rendered to show the constituency boundaries and be entirely grey – so that the only colours are those representing the party results. Because the boundaries generally run to the low-water mark and estuary mid-lines, whereas OpenStreetMap boundaries generally run to the high-water mark and consider estuaries to be sea rather than river, there are some odd looking estuarine areas (e.g. the Bristol Channel and the Thames Estuary.)

Said another way, this is because of a mismatch between where OpenStreetMap and the parliamentary boundaries commission consider the rivers to stop and the coast to start. I have manually edited two boundaries – NW Bristol sticks far out into the Bristol Channel, and the Medway boundaries also stick far out. NW Bristol’s centroid was also manually moved. There are other, lesser quirks with the data, and being OSM data, not every village is on there yet. I consider the background imagery overall to be “good enough” for the visualisation at hand.

No fancy AJAX was used – the data (about 120KB) is simply loaded into the browser at the start – the visualisation being done entirely on your browser using the OpenLayers API.

It’s not very easy to draw circles in Javascript, so I’ve let OpenLayers do it for me. The two circles that make up the key are actually miniature OpenLayers maps themselves, with a single point feature at the origin of the map. They update in sync with the main map.

The visualisation was ready to go last week but the way Internet Explorer draws the vector graphics (using VML rather than SVG) was causing considerable performance problems, when trying to show all 650-odd constituencies at once. As a work around, the map starts by being zoomed in if you visit the site in IE. Zoom out at your peril!

If you spot any bugs (apart from the IE chronic slowness!) please let me know.