2017 General Election hex map
What a night! Like many election geeks I've been up all night following the results of the UK General Election. But in this election I wasn't just watching, I was also visualising the results live.
Recently, at ODI Leeds we created a UK constituency hex map. Hex maps are a better way to represent election results than a geographic map because they give equal visual weight to each constituency. We had published our map under an open license and several companies and individuals had already made use of it to show previous results, majorities and other data.
Late last night I became aware that there was a Democracy Club live result feed so decided to hack together a live results map with it. The first thing I had to tackle was that the feed was in Atom. It also included election results from recent local elections. I haven't used Atom before and, in the middle of the night, didn't have a handy library to parse it. So I wrote my own parser. It is a bit flaky but was good enough to cope with Democracy Club's output. My parser was run on a cronjob every minute and outputted a JSON file of results for the General Election i.e. filtering out local election results. The output file included the constituency code, the name of the winner, and the Electoral Commission's ID for each party. The Democracy Club feed has richer data in it but this seemed like the minimum I could get away with to keep the file size down and still be useful.
Having got myself an updating version of the results in a more useful format, I then adapted the Javascript I'd written previously to show constituency data so that it read the JSON results file every minute. By 1.30am I had something that could be shared on Twitter displaying the first 10 or so results. As the next few hours progressed I posted regular updates on Twitter and tweaked the visual output. I added a timestamp to show when results had last been updated and improved the hover text to show the candidate and party that had won a constituency. The visualisation code is on Github.
By around 5.30am, with 611 results recorded, I started wondering about the gender split of the new Parliament. I couldn't see any analysis of that by anyone on Twitter, and hadn't heard it mentioned on the BBC's TV coverage, so decided to calculate it myself. Again, I could make use of Democracy Club data. In fact I already had an up-to-date copy of every candidate in the election as JSON (converted from Democracy Club's CSV output) so it was just a matter of looping through every constituency, finding out who had won, and getting the gender. Pleasingly, it turned out a new record had been set for the number of women in Parliament. At the time of writing, with one result still to come in, the total currently stands at 31.7% women.
Live-coding an election visualisation was fun. The hardest parts were getting the outputs from Democracy Club in a format that was easier for me to use with Javascript. But, the fact the data were published openly, and in a timely manner, meant I could do that. Huge thanks to everyone at Democracy Club for making this possible.
Ours isn't the only election hex map out there. Oli Hawkins has made a nice visualisation using our hex map layout and the D3.js plugin he created for it. Oli's visualisation also shows the gender, previous experience of the winners, gains, and losses.
Update 14:15: Alex Parsons created a colour-your-own election hex map from our layout.
Update 2017-06-12 13:17: Peter Broad has created a version showing all seats, and who they'd changed from and to.
