protovis part 4: external data and animated labels

The labels are still a little tight against the right edge. Go up to the width variable and change it to 400. Now you can see there is plenty of room for your labels.

Finally, let's add a source line. Scroll back to the bottom, copy the last label code and paste it below. Change the text property to source, change the bottom property to -120 and change the font size to 6pt. If you want, you can concatenate the word source to your text property.

So that's it for this exercise. If you made it all the way through, you should be proud. You now have a powerful template that's easy to edit and swap out data. In our next tutorial, we'll do exactly that, add more complicated data and then convert the chart to create multiple lines. We'll also explore another animation technique.

Here is the complete code:

So that's it.