Explorative infographic showcasing how connected economic industries and Swiss parliamentarians are.
Most of Swiss Parliament's politicians have board member positions at companies or have memberships in organisations. Journalist Boas Ruh wanted to find out interesting connections between the Swiss parliament and the industries.
How can the provided data be made accessible for the reader as an explorative application? What kind of interactive visualization manages to showcase the connection between politicians, parties and industries?
I took the concept of a chord graph and added some space between the left and right side. This way politican's names are connected to their mandates. The politicians and mandates are groupable into parties or branches respectively. This way the data is fully explorable allowing the user start from any entry point.
As the visualization was too complex for touch control on mobile devices only the lower part was displayed.
While the data of the parlamentarian's memberships was officially available, it took Boas Ruh a lot of time to categorize each company's and organisation's type of industry. But this industry classification is the article's USP: It finally allows insight into how much influence each industry has on the various political sides of the parliament.
The data Boas collected consisted of
We decided to make the data available as an interactive element to tell the story.
For structuring the data in an explorative way I had to find answers on
I wanted to have a discussion-opener and started with a basic prototype that manages to output the data by offering navigation controls. My first hypothesis was that industries are the most interesting entry point to explore the data. The prototype depicts these hierarchies:
I decided that displaying how the mandates are distributed over the parties is more interesting than just showing which industry mandates are the most favoured in parliament. Another weakness I found was that there wasn’t enough data available on which politician was connected to the same mandate.. In reality, the reader wants to know the number of mandates a politician has, which industries they are from and what their exact connections are.
For the second prototype iteration, I decided make things selectable in a slightly different order:
Selecting a politician expands their full memberships. All of the above lists are sorted by mandates and provide a small bar graph expressing the numbers: For parties and industries it's the sum of politicians connected to mandates and for politicians the amount of mandates they are assigned to.
Also features like the filtering of cantons and a text search have been added.
Making data explorable doesn't necessarily mean it makes relations more visible – instead there is a danger of accidentally hiding important connections between the politicians and industries. This is why I decided to create a "hero visualization" to deliver an even stronger expression of the politician-branch connections.
Inspired by this hacked chord diagram of Nadieh Bremer, I split the diagram into two curved groups and connected them with each other. For my application, this was ideal to display parties or politicians on the left, and branches on the right side. Using her open code base enabled me to implement an interactive visualization allowing the reader to toggle between the whole parliament, parties and politicians – or to directly focus on a single industry.
The toggling functionality embedded in the visualization is probably quite advanced – even unexpected – for certain user groups. I therefore added a descriptive and visualizing element on top of the list element. It expresses the quantity of visible data and indicates the synchronicity between the upper and lower part.
I designed and developed the visualization using the JavaScript libraries React and d3.