Years, months, days, and hours — in one chart

Hi, this is Lisa, responsible for the blog at Datawrapper. "Waaaait, is this yet another blog post about the German election?" I hear you asking, looking at the chart above. In the last weeks, I was quite busy writing a How to, a Data Vis Dispatch, and two Weekly Charts about exactly this topic. But this week (I promise!), the chart is more important than the topic. This week: a chart experiment.

Election data is fascinating. It exists on so many zoom levels — in space (nation, state, electoral districts), but also in time: We know the election results from the past 70 years, we get new polls daily in the months before an election, and on election night, TV hosts inform us about the latest extrapolated results every hour or so.

For this week's Weekly Chart, I tried to show all the different time scales in a single time series.

You can see how the CDU/CSU got its worst election result ever this year, and that the SPD gained voters just a few weeks before the election.

Playing with scales

This chart doesn't just make it easier to read all the data in one chart — it would be impossible without zooming in and out like that.

I got out my ruler: On my screen, four years in the first "time level" (election results from every four years) are 3 mm wide. On the same scale, the whole election night (the last time level) would be 3 mm/4 years/8760 hours × 7 hours = 0.0006 mm, or 600 nanometers wide. That's 11 times thinner than a red blood cell.

We can also go the opposite way: If we showed the election results between 1949 and 2005 on the same scale as the seven hours of the election night, we'd need a chart that's 2.96 km wide. For showing the election results on the same scale as the daily polls, we'd still need to make 3.36 m of space in our hallway.

How to create a chart like this

You'll notice that these line charts have neither x-axes nor tooltips. In the following chart, I added three axis ticks with the help of our annotations tool:

While the added axis ticks might be considered useful, the tooltips wouldn't. That's because I had to use some tricks to get years, months, days, and hours to appear in the same line chart:

Each time scale gets the same width, which is a random number (180, in my case). I divided that random number by the number of data points (e.g. 16 for the election results): That gave me the distance between data points: 180/16=11.25 . So I knew I had to set my data points for the first time scale at 0, 11.25, 22.5, ...

The column I uploaded as an x-axis are these random distances, calculated for each time scale — and that's what the tooltip would show. Good thing I can turn them off.

I hope you enjoyed this little Weekly Chart experiment! Let me know if you have any questions or feedback at or on Twitter (@lisacmuth). We'll see you next week.