Project description

The 2018 Taiwanese municipal elections for both mayoral and magisterial candidates and a multi-question referendum for issues including same-sex marriage and nuclear power, were held on November 24, 2018. In order to make the numerous election results more accessible to the public, putting the voting behavior of nearly 8000 boroughs in context of regional politics in Taiwan, we built interactive maps that shows the results of both the municipal elections and the referendum.

With two or three simple mouse clicks, users can easily dive into the borough he or she is interested, read about the voting result in the neighborhood, and compare the results with the surrounding neighborhoods. The switch-year button allows users to change the results shown on the map to the 2014 municipal elections in a flash, making comparisons between the two most recent elections very intuitive to execute.

The other interactive map shows the detailed results of municipal election and referendum for every county. Users can switch county to county and topic to topic, to cross-examine different aspects of election, such as \”Do Kuomintang supporters also support anti-gay right referendum?\”, \”how do voters living close to nuclear power plants vote on the pro-green energy referendum\”.

What makes this project innovative?

The interactive map uses the open data provided by Central Election Commission (CEC) through api call. Almost all news media except CommonWealth Magazine use the api to build traditional election result dashboard, showing how many votes every candidate gets in plain numeric or only producing county-level map, without detailed visual interactive feature for the voters to dig into how their neighborhood vote in the election. CommonWealth Magazine for the first time in media history of Taiwan released an all-encompassing interactive election result map, providing results as detailed as possible, right on the next day of voting day. The interactive map was built with d3.js, R, certain npm packages, GIS software and other technologies. For the map so large to zoom in/out smoothly, we spent lots of time rewrite how every frame of map transition was executed by browser, and we also took a lot of time figuring out how to lower the burden from the browser to wrangle the voting results of nearly 8000 boroughs. And the mobile usage optimization was achieved by design patterns that prioritize mobile reading experience long existed in the CommonWealth Magazine digital content team.

What was the impact of your project? How did you measure it?

All the above mentioned effort combined to give birth the brand-new election data presentation, gaining explosive popularity among Taiwanese online readership, and earned applauds from news industry observers, school teachers, digital media analysts, etc. Measuring the popularity from PV numbers, the interactive maps gained nearly 400,000 PVs within 9 days. This number widely surpassed the goal set earlier of 100,000 PVs, and made the 2018 election map interactives the second most popular interactive story CommonWealth Magazine has ever launched. Among the 400,000 PVs, around 60% was achieved in the first two days right after voting day, showing the desperate need from the voters/readers to make sense of the election in the context of regional politics when the election results is still the headlines of most news articles in social media. Through social media like Facebook, we also discovered some clever application of the interactive maps by our readers, such as finding the most lgbt-friendly boroughs, showing that the interactivity provides readers the opportunity to discover news for themselves, further adding to the value of interactive election maps.

Source and methodology

The election results were retrieved from CEC database through api call. The map gis data was downloaded from government open data websites. We color every borough based on the election results of municipal election and referendum, and different parties get different colors. The higher voting ratio the winner get, the darker the color it would be.

Technologies Used

We built the interactive maps mainly in d3js, although the gis data for rendering maps were preprocessed using nodejs, utilizing npm packages created by d3js creator Mike Bostock, to reduce the processing jobs executed on the user-side. Election data is cleaned, wrangled and formatted using R. We wrote the script before the data could be retrieved from database using example json files provided by CEC, in order to process the raw data as soon as possible.

Project members

Andy Lin, Iris Huang, Angel Pai, Joanna Hung


Additional links


Click Follow to keep up with the evolution of this project:
you will receive a notification anytime the project leader updates the project page.