Six ways to cover elections with interactive graphics
How to make extruded hex maps, card carousels, animated scatter plots and more to enhance your election coverage
With local elections being held across the UK today, we had a look at six ways to visualize elections with Flourish. The visualizations featured in this post were created specifically with the UK elections in mind, but are relevant for any other elections, too. You’re welcome to embed them on your website: you’ll find embed codes below.
1. Give an overview with projection maps
With elections for 145 English local councils, thirteen directly elected mayors, 39 police and crime commissioners and two parliamentary elections happening at the same time, we quickly found our heads spinning, trying to visualize who, where, was voting on what. We settled on our Projection map with an Albers (30° & 45°) projection to help us get an overview – and created the scrollytelling piece featured below.
County councils are elected in full every four years, with the last election having been in 2017. County councils are the upper part of a two-tier system of local government and provide services such as road maintenance, schools and libraries.
Each council is subdivided into district councils with different responsibilities, such as rubbish collection, Council Tax collection and planning applications. In Unitary authorities and metropolitan districts, the combined services of both tiers are performed by the local government.
There will also be several Mayoral elections taking place on May 6. Some Mayors are elected for combined local authorities, others govern over single authorities, and London elects its own Mayor.
Alongside seven combined authority mayors and five single authority mayors, London is also electing its Mayor. The Mayor of London is normally elected for four years, but because last year's election was rescheduled, this election will be for a three-year term.
In Scotland, a Parliament election is taking place. Scotland will vote to elect 129 Members of the Scottish Parliament (MSPs). This year's election is a significant one: The Scottish National Party is promising to hold a referendum on independence if it wins a majority.
In Wales, 60 members are being elected to the Senedd Cymru – the Welsh Parliament. There is one seat for each National Assembly constituency...
...and the remaining 20 seats are divided equally between the 5 electoral regions. This year's election will be the first in which 16 and 17 year olds and legally resident foreign nationals are allowed to vote in Wales.
Embed code:
To get started with projection maps:
- Select one of our Projection map starting points.
- Merge in your own data via our Upload and merge feature.
- In order to visualize the different county council and mayoral regions in context of the rest of England, we used our new line layer feature to display the outline of England behind them.
- Enhance your popups with custom content, including links, layouts and images. Learn more about how to do this here.
- Combine different map views in a Flourish story and add your narrative.
- We brought our story to life in this post using our no-code “scrollytelling” tool, which is available to our Enterprise customers. Get in touch with our sales team if you’re interested in getting scrollytelling on your own site.
2. Dive deeper with extruded hex maps
When it comes to visualizing constituencies, our hex maps are a great choice. They give equal visual weighting to each region, ensuring small city consituencies aren’t hidden.
To take your hex maps – quite literally – to the next level, you can use our 3D map template to enhance them with extrusion. This allows you to shade by one value – for example by party – but extrude by a different one.
The extruded hex map featured below was created by the Fairer Share campaign leading up to the election to visualize the relation of house prices and Council Tax. Council Tax is an important topic during local elections, as it is something that is up to the individual councils.
Embed code:
To get started with 3D-extruded hex maps:
- Select one of our 3D map starting points – note you can extrude any regions, not just hex regions.
- Merge in your own data via our Upload and merge feature.
- Extrude your regions using the Height column binding.
- Enhance your popups with custom content, including links, layouts and images. Learn more about how to do this here.
3. Visualize candidates with our Cards template
Our Cards template is perfect to give an overview of different candidates at a local level. And with the recently introduced ability to filter and give more information on hover or click via popups and panels, it can be used as a placeholder for even more content. We used cards to introduce the different candidates in the race to become the mayor of London. Click on the cards to explore more!
Embed code:
To get started with our Cards template:
- Select one of our Cards starting points.
- Optionally add a filter via the Filter binding.
- Add more information to popups or panels via the Info for popups column binding and customize your content.
4. Use scatter plots to point out relationships in your data
Scatter plots are ideal for electoral analysis – like the correlation between Council Tax Burden and house prices.
The story below was created by Fairer Share to display how different local authorities compare across multiple categories and how they correlate.
Embed code:
To get started with our Scatter template:
- Select one of our Scatter starting points.
- Upload your data – you might need to unpivot it to get it into the correct format.
- To make use of beeswarms, make sure you have one categorical and one numeric variable to plot and turn on beeswarms in the “Box, violin and beeswarm plots” settings.
- Make use of annotations and selective data labels.
5. Use our Hierarchy template to visualize budgets
Our Hierarchy template allows you to produce “zoomable” interactive stacked bar charts, sunbursts, treemaps and radial trees. These are great to allow your readers to drill down into a story and discover multiple layers of information. The bar option is ideal where you want to focus the viewer on the total value of each group – as opposed to the packed circles mode, for example, which is better for showing distribution and part-to-whole. We visualized the allocation of London’s budget and how revenue was through funding sources in our story below.
Embed code:
To get started with our Hierarchy template:
- Select one of our Hierarchy starting points.
- Upload your data – you might need to unpivot it to get it into the correct format.
- Add a filter or size by multiple columns of data.
- Create a story to showcase different views of your visualization.
6. Explore Elections coverage by other Flourish users
We gathered a few examples from current and previous Elections coverage for you to explore in our Cards visualization below. If you have elections coverage that isn’t displayed here, do reach out to hello@flourish.studio to share your creations!
As ever, it’s free to get started with Flourish. We hope these visualization ideas will help you communicate meaningful insight about upcoming elections, wherever you are.