Annotations #

It is rare that data completely speaks for itself. Instead, we often want to point out a specific part of our data, or help people to understand a subtle point. While a case can certainly be made that the most appropriate solution to this is to make new data visualizations that call attention to these aspects, this is often not practical. For instance, a journal may not allow multiple plots of the same data, to highlight different aspects. In such cases, it is typical to annotate the figure, with text or images that draw attention and explain parts of the data. Here, we look at some ideas surrounding annotation.

Using arrows and other symbols #

Perhaps the simplest and most common annotations are symbols such as the asterisk (*) and the arrow (\rightarrow). These are used to draw attention to a particular point on a plot. Additionally, asterisks are often used to indicate a statistically significant difference between two measurements, and will be found on bar charts indicating differences between bars.

Even though these are simple additions to a chart, we can still spend time thinking about how to design them. For one, the above charts used annotations that are black—the same color as the axes. Thus, the closest association (at least in color) is with elements supporting the data. It is worth asking if we might like the annotation to be more closely associated with the data itself, in which case we can use the same same color for the data as the annotation.

We might also consider that we want to call out the specific bars or points that are being labeled, and so we could color them differently (or use any of the other tools we have, such as fill and lines).

Additionally, there is the question of how far away to place the annotation from the point it annotates. Though there is no hard and fast rule, you might take a clue from the other text on the page, and consider the spacing between letters or between lines as a guide.

Placing text on the page #

Speaking of text, there are times we want to add more details to our simple annotations. For instance, when pointing to a specific data point, we might wish to call out the x and y values. In this case, you can do something as simple as add them next to an arrow, in the same color, and using the same font spacing.

But maybe you also wish to add even more detail than this. Full sentences and paragraphs can be added in the same way, just make sure you pay attention to alignment. Text looks best left-aligned, but then placing an arrow becomes problematic. Thus, consider using center aligned text, even for long bits of text, when you are placing them onto the plotting canvas.

Beyond points and arrows: enclosure #

Above, we were considering how to annotate only a single point—a case where an arrow makes a great deal of sense. However, there are times where you might wish to annotate a region of data. For this, you might use a tool known as enclosure. You can read the entire article on this, if you want, but the main idea is that, by placing a simple box around a region, you draw attention to that region.

This same approach can be used for text labeling as well. If you simply draw a box around the text, you can then connect a line or arrow to it, to make the annotation feel more connected to the arrow. Additionally, it can help solve some of the above issues with strange alignment problems.

Conclusions #

The concepts behind annotations is really no different from all the other design concepts we can considered. Basically, we are looking for ways to bring our general design principles to bear on adding some additional information and context.

One bit of advice I will add is that, one might wish to be careful about adding too much annotation. Doing so can yield a plot that appears too cluttered.