Animating data visualizations

When we animate a data visualization, the values shown during the animation never correspond to the actual fluctuation of the observed phenomenon. The reason is that we only have discreet data values and we don’t know the values between the measured points. (In physics this is not true according to the Nyquist-Shannon sampling theorem, but this blog focusses on charts showing statistics and such.)

Nevertheless, you may have good reasons to animate a data visualization. And if you do, do we have some means to measure its quality?

In the scatterplot below we can see a data point at time T1 and at time T2. A possibility to animate from T1 to T2 is by travelling the shortest path or in this case a straight line between the two points.

But if we take into account its position at T3, we could also opt for a curved trajectory.

These different strategies are also applicable to drawing line charts. Whether you choose a connection by using straight lines, by fitting an n-th order polynomial or any other strategy can be based on:

  • coding complexity
  • aesthetic considerations
  • perceptual effectiveness of the animation
  • the desire to comply to the underlying data model

Choosing the animation trajectory is one topic. Another topic is the speed: does the dot travel with linear motion or does it for example accelerate?

Animation Lie Factor

Knowing that we have different ways to animate a visualization, can we say anything about the quality of the animation? Can we, for example, apply Tufte’s Lie Factor to animations?

A problem is that if we want to quantify the ‘lie’, we must be able to define what is meant by ‘truth’. As we have seen in the previous examples, we cannot determine the actual data flow between two consecutive data points. We have no way to determine the truth and can thus not quantify the lie.

Animation types

So is there anything we can say about the quality of animations? Perhaps we should first try to classify animations into animations that:

  1. follow the shortest path between consecutive data points
  2. follow the most likely path between consecutive data points
  3. simulate a possible path between consecutive data points
  4. don’t fall into any category mentioned above

Animations of the first category focus on the data change, i.e. the difference between discreet values. They don’t try to visualize the actual data flow in between the data points. The animations are domain ignorant/agnostic . The animation is an abstraction. If you work with visualization tools then this is probably the default animation setting. Sometimes tools have different easing functions. Functions like ‘bounce’ and ‘elastic’ are examples that don’t follow the shortest path. Using these functions inappropriately can be considered ‘animation junk’. (See Tufte’s chart junk).

Animations of the second category follow a path that complies to a model. Say that we have to visualize and animate the position of an elevator during the day. We can create a model by using laws of physics and knowledge about the elevator properties. And by just knowing the exact time that an elevator leaves a floor and arrives at another we can animate the most likely position at any time in between. The animations make use of domain knowledge.

Animations of the third category don’t try to show the viewer what really happened in between measurements, but try to give an impression of what possibly could have happened.

I have yet to make an inventory of visualizations that don’t fall into any of the categories mentioned above.

What are the benefits of classifying animations? I hope that it gives a framework to think about animations and to determine why and how you can use them. My focus in this post are ‘data resonant’ animations.  Animations that communicate information and don’t suggest anything that is not there.

It would be great if one could apply a formula like Tufte’s Lie Factor to animations, but perhaps it’s enough to be able to flag a warning based on observations.

Animating data visualizations means filling the gap between measured data points, both in place and in time. There are various approaches to do this. By making a conscious choice for a specific approach, you can shape your animations.

I haven’t shown any practical examples in this post. This is on my todo-list.

Because this is a blog about Isotype, I would like to answer the following question:

What kind of animations are possible with Isotype and when are they appropriate to be used?

In my next post I will try to answer this question.


Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>