How, when, and why to use bullet charts

Bullet charts, an invention of Stephen Few's, are a handy visualization tool. Though not often seen, the bullet chart is often a better option than other competing visualization types, such as the dashboard gauge.

Why use a bullet chart?

Why should we prefer to use the bullet chart? The dashboard gauge places all of the values to be analyzed around a circle. This then means that we must make quick angle comparisons if we want to distinguish one value from another.

Take a look at this example from Klipfolio:

How far below our target is our measurement? What is the value that is being indicated by the indicator bar? It turns out that the value is $23.6M. That is an incredibly difficult calculation to make, though -- you have to mentally calculate how many millions of dollars correspond to each portion of the arc, determine how many degrees away from 0 the indicator bar is, and determine the degree difference between the $30M target and the indicator. 

Where the dashboard gauge necessitates an angle comparison to determine the difference between two charts, a bullet chart only requires a comparsion between two common scales. This is preferable because we are making use of a stronger preattentive attribute of visual perception. In other words, we are more readily able to discern objects that make us undertake linear scale comparisons than those that make us undertake slope or angle comparisons. You can see a very useful chart that compares the relative accuracy of different attributes of visual perception here:

The visualization is from Alberto Cairo's superb The Functional Art. If you are unfamiliar with preattentive visual attributes, check out Cairo's book or Stephen Few's excellent article, Tapping the Power of Visual Perception.

We ought to prefer bullet charts because they make use of a stronger preattentive attribute. If we are looking at two bullet charts that are aligned, we even get to make a comparison along two common, aligned scales.

When to use a bullet chart?

A bullet chart is useful when you have a single, continuous variable whose value you wish to indicate in relation to several categorical regions. For example, you might wish to categorize economic growth for a country (measured in percentage points, so a continuous variable) as good, average, or bad (a categorical indicator).

How to create a bullet chart?

There are a number of ways to create bullet charts using modern visualization tools. One approach is to make them from scratch using d3. For a great overview of how to create these, you can read Mike Bostock's Bullet Chart Block.

For those wishing to use a higher-level JavaScript library which will enable you to make a bullet chart using just a few lines, check out NVD3.