Election results, live, for the whole country at once

1. 01

   Everyone arrives at once

   Traffic peaks on election night and as results come in, exactly when the site is most visible and can least afford to slow down or go offline.

2. 02

   Results as they're released

   Figures change throughout the count across thousands of voting districts, and readers expect to see them soon after the IEC publishes them.

3. 03

   Visuals that stand apart

   Every news site carries the same official numbers, so the results had to be shown in a way readers couldn't get anywhere else.

Election night, end to end

1. 1

   Prepare

   Boundaries for every province, municipality, ward, and voting district are converted from GeoJSON into compact TopoJSON files, and parties and past results are loaded from the IEC, so the map is ready before the first vote is counted.

2. 2

   Register

   In the weeks before the vote, readers enter their home address and ID number to check that they're registered in the voting district where they live.

3. 3

   Count

   Every 8 minutes, results for voting districts still being counted are fetched from the IEC in parallel, then for wards, municipalities, provinces, and the country, with each run logged.

4. 4

   Refresh

   When a results update finishes, the server cache for that election is cleared, and a snapshot of each municipality's results is saved for the charts that show the count over time.

5. 5

   Serve

   Requests go through the CDN, readers' browsers keep responses for a short time, repeat requests are answered from the shared server cache, and map shapes and party logos are static files cached for weeks.

6. 6

   Explore

   Readers drill from the country to their own voting district, switch to a cluster view of voting stations, compare past elections, or follow the metro battlegrounds, on the site or embedded in articles.

• Results map

  Every area is shaded in the leading party's colour, lighter or darker by its share of the vote. Readers drill down from the country to a single voting district, or type their address to jump straight to their own.

• Voting station clusters

  A second map view groups the results of individual voting stations into a grid, so patterns inside a municipality or ward show up at a glance.

• Compare elections

  Any area's results set against national, provincial, and municipal elections back to 2009, with charts of how each party's share changed by year and by party.

• Metro battlegrounds

  The top metros on one page, with each party's share charted as votes were counted, the change since 2016, and vote shares across past elections.

• Live IEC results

  Official ballot and seat results pulled from the IEC's results service on a schedule, from voting districts up to the whole country, with the progress of the count for each area.

• Caching at every layer

  A CDN in front of the site, browser caching, a shared server cache keyed by each request, and long-lived static files for compressed map shapes and logos, so most requests never reach the database.

• Registration checker

  Before the vote, readers enter their address and ID number to find out whether they're registered in the voting district where they live, and what to do if they're not.

• Embeds & news

  Maps and battleground pages can be embedded in TimesLIVE articles without the site's navigation, and the latest TimesLIVE election coverage is shown alongside the results, refreshed every 2 minutes.

• Readers

  • Results for their own voting district
  • A map shaded by party and strength of lead
  • Each result set against past elections

• Journalists & editors

  • Maps and charts to embed in articles
  • Metro battlegrounds charted over the count
  • Changes since the last election, by party

• Voters before the vote

  • A check that they're registered in the right place
  • Their voting district found from their address
  • Clear next steps if their registration is wrong

• TimesLIVE

  • A results site in its own look and header
  • Its latest election coverage beside the results
  • A site that stayed online on the busiest nights

1. 2016

   First election

   Our first results site for TimesLIVE, built for the 2016 municipal elections.

2. 2019

   National elections

   Results for the national and provincial elections on the same codebase, improved after what we learned in 2016.

3. 2021

   Improved again

   From March, for the November municipal elections: the registration checker, results to voting-district level, comparisons back to 2009, metro battlegrounds, compressed map shapes, and reworked caching.

4. November 2021

   Election week

   A live banner switched on for the count, fixes to the battlegrounds on mobile, and automatic refreshing switched off once counting ended.

• Caching at every layer: Cloudflare's CDN, short-lived browser caching, a shared server cache stored in binary rather than JSON, and static map shapes and logos cached for 30 days. Past elections never change, so their results are cached for up to 10 days.
• The server cache for the live election is cleared as soon as each results update finishes, so readers get new figures quickly without every request being worked out again.
• Each sync fetches only the voting districts whose counts aren't complete, in parallel, then rolls up through wards, municipalities, and provinces, and logs the time taken and the IEC's response times at every level.
• Map boundaries are converted from GeoJSON to TopoJSON, which stores each shared border once, with coordinates cut to five decimal places and a static file for each area. Results go out as compact arrays, so the API sends far less and the heaviest data is never generated on demand.
• For national elections, seats are calculated from the votes counted so far, then replaced by the IEC's own allocation once counting is complete.
• Syncing, caching, and the live banner are all settings, so behaviour on the night could be changed without a redeployment.

• .NET
• ASP.NET Core
• SQL Server
• Angular
• Ionic
• Leaflet
• TopoJSON
• Chart.js
• Cloudflare