Animating infographics: Bar charts

- Bar charts are easy to animate because they're basically straight lines. And we've seen in other videos that any time we have a straight line we can make it appear to grow with a little scaling trick. I've used that trick here. For each bar, I've set the scaling to be a width of 100%, a height of 0, and have it grow to the Current Appearance from the bottom point. That's going to make the bar start at zero here and grow up. Now the issue here that I wanted to show you is when you have text on these bars.

Let's see what happens with this trick when we apply it to bars that have a legend on them or a description of what each bar is. I'll show it to you in the preview panel. Notice how the type is scaling. Now some people might like that. It sort of looks like it's folding out as it goes up but I'm not crazy about it. And I'd like to show you a slightly different way of approaching this bar chart that will eliminate that strange scaling with the type, unless you like it of course and then you can use this technique.

I'm going to go to the second page of this file and show you a different treatment of the bars in the chart. Let's look at it in a preview panel. And here you see the bars grow but the type is not distorted in any way. It's revealed as the bar goes up. What we've done in this case is instead of scaling the bars in the chart, is we've used these hide boxes and we're scaling those to make the bars grow.

I'll show you how this was set up. Let me go to the next page of this file which isn't animated. And you'll see that over each bar we have this hiding box and it's the same color as our background. Now what I'm going to do is select each of these hiding boxes in order, and we'll scale those. We want the width to be 100%. We want the height to go to 0. And we're going to leave it From Current Appearance because we want it to go from this appearance to basically make it go away.

We'll set the proxy up here because we want it to scale from the bottom up. Let's take a look. Great, and that's how we get this effect. Little trick with the hiding boxes. Now the last thing I'll point out here is some of these shorter bars grow really quickly, 2005, 2009, 2011, and so I'm going to hold down the shift key and select those hiding bars. And I'm going to slow them down just a little bit.

Those bars are shorter, so if they're revealed at the same speed, they're going to seem to happen rather quickly. And now all our bars should seem to grow at a similar speed even though some of the bars are a little bit shorter. Bar charts are easy to animate. Because they're straight objects you can use our scaling trick to scale the bars themselves. Or if you have type on them, you might want to scale bars that hide them. Either way you'll have set a higher bar for your bar chart presentations.