ge2011viz_v2

The latest version of SG elections is up at elections.viz.sg.

In addition to the original GE2011 data, the elector, map and candidate data have now been added for GE2015. There is also a new chloropleth map on where the opposition is contesting.

There has also been significant redesign of the UI and layout, especially the tables in how the information is presented.

This aligned with our goal of making the site more responsive, and the layout is cleaner for both desktops (you probably don’t need to scroll anymore to see all the details) and mobiles/tablets (It fits a vertical view better).

Making the piece responsive was a pain to write — had to make sure it mostly works on all the browsers and various form factors (mobile / tablet / desktop).

Lastly, we added in some bling factor with cool animations and transitions. Kok Keong did an absolutely amazing job with the year transitions and the change in districts!

Embedding chloropleth maps for GE2015

In addition to the above, we also created responsive embeddable election charts for any blog or media who wants to embed them! All we ask for is just to attribute back to either V/R or viz.sg. Thanks!

The five charts are listed below, with sample iFrame code that you can just copy and paste and it should work.

Seats and Candidates:


<div style="position: relative; padding-bottom: 70%; height: 0; overflow: hidden;"><iframe src="http://elections.viz.sg/embed_seats.html" style="position: absolute; top:0; left: 0; width: 100%; height: 100%;" frameborder="0" scrolling="no"></iframe></div>

Opposition Parties:


<div style="position: relative; padding-bottom: 70%; height: 0; overflow: hidden;"><iframe src="http://elections.viz.sg/embed_opposition_parties.html" style="position: absolute; top:0; left: 0; width: 100%; height: 100%;" frameborder="0" scrolling="no"></iframe></div>

The following charts are not populated yet because the election data is not in yet. We will update it live during the elections on 11th September 2015, which will colour the map. The following embeds are designed to self-refresh after 5 mins.

Stick them on your blog page and it will refresh live during the election on 11th September!

Vote Share:


<div style="position: relative; padding-bottom: 70%; height: 0; overflow: hidden;"><iframe src="http://elections.viz.sg/embed_vote_share.html" style="position: absolute; top:0; left: 0; width: 100%; height: 100%;" frameborder="0" scrolling="no"></iframe></div>

Non-voters:


<div style="position: relative; padding-bottom: 70%; height: 0; overflow: hidden;"><iframe src="http://elections.viz.sg/embed_non_voters.html" style="position: absolute; top:0; left: 0; width: 100%; height: 100%;" frameborder="0" scrolling="no"></iframe></div>

Spoiled votes:


<div style="position: relative; padding-bottom: 70%; height: 0; overflow: hidden;"><iframe src="http://elections.viz.sg/embed_spoiled_votes.html" style="position: absolute; top:0; left: 0; width: 100%; height: 100%;" frameborder="0" scrolling="no"></iframe></div>