User Experience Stack Exchange is a question and answer site for user experience researchers and experts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I am working on some routines for a client application to visualize data in a 3d bar chart style. The data consists mostly of smaller values with only a few large values. For example:


So, the problem is that the large values pretty much makes the visualization useless. Does anyone have any suggestions on how to display this data … OR … perhaps a suggestion on how to massage the data to make it more visually appealing?

share|improve this question
Obligatory - – AJ Henderson Mar 15 '13 at 13:25
@AJHenderson How are you able to recall the xkcd comics when it is time to add one in? There are thousands of them in the archive! – JFW Mar 15 '13 at 18:28
@JFW - I make a habit of memorizing useless trivia and search by title. – AJ Henderson Mar 15 '13 at 19:49
@AJHenderson: pitty you didn't make it a real answer. That way, the xkcd could simply have been embedded... – André May 7 '13 at 14:01
up vote 39 down vote accepted

For anyone mathematically inclined, the answer is to use a log scale.

For non-mathematical people, you may be better off showing a break in the chart and then the extreme value.

enter image description here

share|improve this answer
That is what I was looking for. – onedeadgod Mar 15 '13 at 13:56
Log scale :) – icc97 Mar 19 '13 at 21:45
As much as I hate to downvote, I really don't think the 'non-mathematical' option is a good solution. It's more misleading than helpful, as the mind's got a pretty powerful inclination to compare the bars without taking the axis break into consideration. In such a situation, a simple table of numbers might be better, as you'll instantly see that some values are much wider than others. – Mal Ross Mar 20 '13 at 21:29
@MalRoss it isn't always about comparing all the values with each other. Sometimes it's more about visualising the relationships between a lower group and a higher group. And in terms of reading charts vs. tables, charts give a much quicker overview, and so are often preferred in business. – JohnGB Mar 20 '13 at 22:08
This graph is really misleading. Not only is there a break, there is also a scale change over that break. That makes the visualization very hard to interpret correctly, and therefor, useless. For instance: at first sight, it looks like the increase just before the big jump (around Nov 09) is about the same as the decrease for the second high bar. It is not. There is an order of magnitude difference. – André May 7 '13 at 14:04

You could use logarithmic axes. This allows you to compactly visualize wide ranging variables.

To illustrate, here is a very simple logarithmic visualization:

6 942 535 341
       23 598 
      419 203 
        8 201

The length of each datum represented as a number is (roughly) log_10 of that number. So just printing the numbers in a monospaced font will give you a kind of automatic bar chart.

share|improve this answer
The monospaced font tip is great! – Stephen Mar 17 '13 at 11:38
Thank you. I think I got it from Tufte's The visual display of quantative information. – Peter Mar 17 '13 at 20:02

John GB's solution is aesthetically pleasing, but scientific fields generally discourage scale breaks like those shown (and are often cliche examples of misleading graphics). Cleveland (1984) suggests to use a full scale break, making a separate panel, to further visually distinguish between the values.

enter image description here

Jon Peltier has a similar example using multi-panels, but has a gradient effect for the bars going into the second higher value panel.

Scale breaks IMO are probably not as bad as everyone seems to make them, but here is a simple alternative if someone is giving you a problem with it (in addition to the other fine answers already)!

share|improve this answer

Logarithmic scales are probably the best bet, though they still end up throwing off the true vastness of the difference. It really depends on what needs to be conveyed by the way that the information is displayed. If the vastness of the difference is of key importance then simply graphing the small number as a very small line may still be appropriate.

share|improve this answer

Get one more dimension ! Represent the values as areas. Squares or discs. Like on the anamorphic maps.

Then, if you still need more to represent your values, make cubes, or balls ! :-) 


They use this technique in the Billion Dollar Gram.

Graph comparing large quantities of money

share|improve this answer

I think of two possible approaches:

1- Use areas. Like, a small square dot against a big rectangle area. The advantage of this approach is that the areas are proportional to the square of the measure.

2- Allow zooming. Draw the columns in scale and let the user zoom in until the small values are visible, or zoom out until the big value fits into the window.

share|improve this answer

Well, I was struggling with this problem. I don't recommend to use log scale, first not all users will understand this scale, second one, if you have values that are close the difference between them won't be noticeable on the graph.

I recommend two solutions:

  1. break graphs: but we need to remember to change the scale, scale must be adjusted not to the biggest value, but to the rest smaller values, for the user it's more important to see even subtle differences between smaller values, also bigger bar are easier to be clikced

enter image description here

  1. spheres - also good solution, spehers shouldn't be proportional, cause if they are, smaller values won't be displayed - they will be so small that only one biggest value would be noticeable

enter image description here

share|improve this answer

I like the idea of using spherical objects where applicable. The larger areas can clearly hold several times more area while keeping the smaller areas visible.


download bmml source – Wireframes created with Balsamiq Mockups

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.