Sign In  |  Join Now Become a member to add links and start earning points!

Selecting the Right Chart Type for your Data

The world today has way too much data, but very little information. In this tutorial I’ll show you how to convert your data into powerful information by selecting the right charts for expressing them.

Unless you are a data-analyst or a statistician, you will probably be using two commonly used types of data analysis: Comparison and Composition.

Comparison of data is the most common and easy to understand type of data analysis. And that makes it the perfect starting point. So let us dive in.

Comparison of data

Consider the following cases:

  • You want to compare the Quarterly Revenues of a product company over a period of 4 years.
  • You want to compare the total visitors of ten competing websites for the month of May.
  • You want to visualize the population trends of a country over a period of 170 years.

All these are examples of comparison of data. Let us now see how we go about deciding which chart to use for which situation.

1) Comparing Quarterly Sales over 4 years

We make a note of the following points:

  • The Revenue (in dollars) will be shown along one axis.
  • The time (quarter number) will be plotted along another axis.
  • There are four categories: Q1, Q2, Q3 and Q4.
  • Each category will have 4 columns for years 2006 through 2009.

Since the number of categories is quite small (less than 5) a column chart will be apt for this case.

2D Column Chart
In each set of columns we have used a progressively darker shade of the same color; blue in this case. The progression of shades makes the sequence (2006, 2007, 2008, 2009) apparent. Using shades of a single basic color shows that all of them belong to the same data type.

2) Comparison of total visitors to 10 competing websites

We make notes again:

  • The names (URLs, which are pretty long) of websites appear on one axis.
  • The number of visitors appear on another axis.
  • The number of categories is 10 (the number of websites).

We will choose a bar chart for this scenario because:

  • A bar chart is suitable when the number of categories is higher than 8 and lower than 15.
  • Bar charts give you more space for long text (since the screens are wider than they are high)
Bar Chart for showing visitors to 10 competing websites
The data sets have been arranged in descending order. This makes comprehension of data much easier as your eyes follow a decreasing pattern. With the pattern, they can connect shape to value much quicker.

3) Population trend of a country over a period of 10 years.

Notes, yet again:

  • Time (years) will be plotted along the X- axis (people are used to seeing time on X-axis. Physics guys nod your heads here).
  • The Total Population will be plotted along the Y-axis.
  • The number of categories/data points is very high (much more than 20).

We will choose a line chart for this plot because:

  • The number of data points is very high and a column or bar chart will look pretty cluttered.
  • Our aim for this chart is not to show the maximum or the minimum population. We are trying to show the trend, that is the rate of change of population (steepness of the line) rather than the population itself. A line chart is best suited for showing trend-based visualization.
Line Chart - Showing Population Trend of a country

This chart easily shows Abracadabra’s population growth to be almost parabolic with occasional negative spikes indicating catastrophes such as famines, etc.

Abracadabra is a good fictitious name to use when you can’t think of anything better.

So far, we have talked about data visualization for comparison of data. Next, we come to charts that depict composition of data.

Composition of data

Consider the following cases:

  • You want to plot the break-up of traffic sources to your website.
  • You want to plot the break-up of the visitors to your site by the duration they stayed on your site, in turn broken down on a day-wise basis.

All these are examples of composition data plots. Charts that are ideal for this kind of data are Pie/Doughnut charts, Stacked Charts, Multi-level pie charts etc. So let’s take this case-by-case and see which chart will be the best for each case.

1) Break-up of the visitors to your site based on traffic source

  • There will be 4 categories: Direct Traffic, Search Engines, Referring Sites and Others
  • We will plot the values in %, as we are interested in a comparative study more than the exact values.

The pie chart is a good fit given the conditions above, as we need to visualize the part to whole relationship of the traffic sources.

Pie Chart - Breakup of traffic by traffic sources

The use of pie charts is pretty debatable. So do NOT use a pie chart:

  • If you have more than 6 categories, unless there is this one clear winner that you want to focus on.
  • If two or more categories have almost the same values.
  • To sum up a couple or more categories and then compare them to another sum.

The pie and the doughnut chart are inter-changeable, and the choice mostly depends on your (or your client’s) taste.

2) Break-up of the visitors to your site depending on the duration of stay

  • The number of visitors will be broken down as per the time they spend on the website.
  • We also need to compare the above statistics depending on the day of the week. So the number of visitors by duration will in turn be broken down by the day of the week
  • The total number of visitors to the site on every day also has to be displayed.

We will use a stacked column chart for our purposes because:

  • It can show the break-up of visits by duration and show the whole using the same data plot.
  • The number of categories is small – five, or seven if you want to consider weekends as well.
Stacked Column Chart - Breakup of visitors by time spent

The stacked area chart could have been considered. But it is better suited when you want to see the trend of composition, rather than being concerned with the exact quantitative values.

So we have talked about Comparison and Composition of data. There is also another type of data analysis that combines the merits and functionality of both Comparison and Composition into one.

Distribution of data

Consider the following cases:

  • You want to plot the variation of relative humidity with temperature.
  • You want to plot the variation of rainfall with temperature.

In both these situations there are two parameters where one depends on another. In the first case for every temperature value (in centigrade) there will be a corresponding value of relative humidity. The data set includes a set of such pairs of values (temperature, RH). This is ideal for the use of a Scatter chart.

Scatter Chart - Relative Humidity v Temperature

Similarly we will use a Scatter chart to represent the variation of rainfall with temperature.

Scatter Chart - Rainfall vs Temperature

Thus, a scatter chart is used when:

  • There are a large number of discrete data points.
  • There are two variables that are inter-dependent.
  • If there are two or more sets of data (multi-series scatter) and you want to show similarity in their variations with respect to a single parameter. The common parameter is usually plotted along the horizontal axis.

We have reached the last leg of our article where we will talk about a chart where every point has-not two-but three associated parameters. Thus, it shows the inter-relationship between three variables. In the previous example, if you wanted to plot both the relative humidity and the rainfall of a place against the temperature, you can use the Bubble chart.

Bubble Chart

The chart has temperature along the horizontal axis and relative humidity along the vertical axis. The location of the circles therefore shows the variation of RH with temperature. The radius of each circle or bubble represents the amount of rainfall for a particular set of {Temperature, RH}.

The End. Or is it?

It is pretty difficult to have a guideline for all types of charts that soak in all kinds of data. For that a book will not be enough, let alone a tutorial. However, I have tried to cover the basic data representations and how to classify them as one of the three types viz, Comparison, Composition and Distribution.

The best way to select the right chart for your data is to ask yourself what you intend to analyze. Is it finding out a pattern? Is it seeing the break-up of one-complete-whole-something? Once you have your answer, your data analysis can be categorized into one of the 3 methods we just discussed. Then go ahead and plot the chart you think is the most suitable (with the help of the pointers given in the tutorial). If you are able to analyze whatever data you set out to, there you have it. If you could not, try out the other charting variations possible in that category. Sooner or later, you will strike gold.

Even though time consuming to start with, it is a very methodical approach. Once you master the art of selecting the right chart, it will serve you forever, placing powerful actionable information in your hands.

This post was written with the help of @hatfullofrain

39 Comments

  1. Add point Subtract point
    Vijay Anand N (1 Point) November 23, 2010 at 7:20 am

    A good resource to determine which chart type suits your data best is at http://chartchooser.juiceanalytics.com

    Flag as inappropriate
  2. Add point Subtract point
    تقنية المعلومات (0 Points) September 28, 2010 at 10:21 am

    what a great advice thanks

    Flag as inappropriate
  3. Add point Subtract point
    sai prasad (0 Points) July 20, 2010 at 7:50 am

    Thanks for a gr8 article. Will certainly be helpful.

    Flag as inappropriate
  4. Add point Subtract point
    penecp (0 Points) July 18, 2010 at 4:43 pm

    Informacion para un grupo de señores

    Flag as inappropriate
  5. Add point Subtract point
    Web Design (0 Points) April 26, 2010 at 8:16 pm

    Great info Thanks for sharing :)

    Flag as inappropriate
  6. Add point Subtract point
    เพลงใหม่ล่าสุด (0 Points) February 2, 2010 at 11:29 pm

    Thanks for your post , Great post.39

    Flag as inappropriate
  7. Add point Subtract point
    เพลงใหม่ล่าสุด (0 Points) February 2, 2010 at 3:34 am

    Thanks for your post , Great post.32

    Flag as inappropriate
  8. Add point Subtract point
    ดาวน์โหลดเพลงฟรี (-1 Points) February 1, 2010 at 5:17 am

    wow thanks so much.151

    Flag as inappropriate
  9. Add point Subtract point
    เพลงใหม่ล่าสุด (0 Points) January 30, 2010 at 11:36 pm

    wow thanks so much.

    Flag as inappropriate
  10. Add point Subtract point

    Thank you for the response :)

    Among the points you bring up, I think a particularly interesting one to call out is the implication of “management’s desire for impressive” versus “the user’s desire to do their job” . That is definitely something I hear on a regular basis.

    We as designers are often put into a corner with conversations like these — on one hand, we want to produce high-quality products that are attractive. With Marketing sitting over our shoulder and Sales clamoring that what clients really want is “time-series animated, multi-color pie charts with drill-down functionality,” it’s a wonder that dashboards and visualizations are ever successful :)

    I haven’t yet come up with a fool-proof method of diffusing these conversations. What I have found is by adding user testing and validation (as opposed to talking solely with the client who is purchasing) to a product’s development cycle, and then collaborating with any part of your organization that is pushing for “purely sexy” design considerations, the results usually speak for themselves.

    For your readers who are interested in learning more about chart and graph design, I can recommend the discussion boards at Visual Business Intelligence and Flowing Data.

    Flag as inappropriate
  11. Add point Subtract point

    Sanket, thank you for taking the time to put together the article, it contains a wealth of information about chart selection.

    I do have a couple of questions for you about the design of the charts.

    What is your take on the use of graphic flourishes such as gradients and faux-3D effects? If the intent of presenting data in chart or graph form is to communicate to the viewer, do you feel this is conveyed clearly?

    In my experience, the intent of visualization is to distill numerical data into a form that allows a user to quickly monitor and analyze a situation, so they can take action as needed. By presenting information with “extras” (such as drop-shadows, gradients, display of the third dimesion, etc.), you risk reducing the effectiveness of the information and making it less usable.

    In example #2 above, you use a stacked bar chart to encode two values, “duration of visit” and “total visitors”, segmented by the days of the work week. While I suppose that this information could be of use to a viewer as displayed, I would challenge it for two reasons:

    a) If the intent of the chart is to show total visitor count on a given day, including the duration of the visits within the bar substantially diminishes the clarity of the primary presentation.

    b) If the intent of the chart is to show the different duration types of the visits as comparative measures against each other, then stacking them is only beneficial for the initial stack. Once you move to the second and beyond, the different types cannot be baselined against one another because they start in an off-set position. Therefore, if you were trying to quickly understand if the number of visitors that spent “5 sec – 30 sec” on the site on Thursday was smaller or larger on Friday or Tuesday, and to what degree, you would be hard pressed to do it.

    c) If there was a particular reason that mandated that these two values be encoded on the same chart, I would recommend breaking up the stack and presenting the visitor-duration types as a set of vertical bars with an overlay line graph tracking “daily total visitors”.

    Those challenges are one of the reasons that I am a vocal opponent within my organization against using stacked bars for any reason. It has been my experience that for every time you can use a stacked bar, that there is another method that displays the data with greater clarity.

    I am always looking for differing opinions though, so if you have found situations where the stacked bar is employed, and your users gain a better understanding of the data set, I would enjoy taking a look to see if my users would also.

    Thanks!

    Flag as inappropriate
    • Add point Subtract point
      Sanket Nadhani (1 Point) October 10, 2009 at 2:59 pm

      I like healthy debates too Ben, so it is good to hear your differing opinion :)

      My take on the graphic flourishes is that it is essential in quite a number of places. Good looking visualization can attract the visitor to it, and he will be like: “Yes it looks great. Now let me see what it is trying to show.” On the other hand, if it is displayed using long data tables or plain vanilla charts, the end user will be put off by it and he would developed a mental block towards the data even before he starts analyzing it.

      On the other hand, if you have a situation in which you are analyzing a very critical process in real time, then surely cut out all the frills – straight to the point visualization with no scroll bars and no different tabs is what you need there. In my experience, good looking charts seem to go down really well during sales demos and with the management (helping you “massage” the figures when they have not met the target :) )

      As for the stacked column, yes I will agree with you on some points. The best thing to do would be to first show the total no of visits per day and then on clicking on a particular day, drill down and show the duration of stay for that particular day. But owing to a number of reasons, drill-downs cannot be implemented every time. So in that case, the stacked chart comes in really handy to show a lot of information in a small compact space. Yes, we could break it down into vertical bars with an overlaid line graph but then that will take a lot of space, which is quite often a constraint (especially when you are making dashboards and a lot of information has to fit in one screen). The stacked chart is fine in finding out the differences in the break-up for up to 5-6 data sets, but more than that does turn out to be a problem. Also, you will be hard pressed if the difference in the stacks is not too much and you have to make a decision on that. As a final note I would say that stacked charts do not help you compare values that are very close but like in my example, when the values are pretty far off, it does equip you well enough to pass judgment.

      Flag as inappropriate
  12. Add point Subtract point
    DarkOs (1 Point) October 9, 2009 at 9:21 am

    I find the article “OK for simple needs” but I especially found it was more like a hidden advertisement…

    Flag as inappropriate
    • Add point Subtract point
      Sanket Nadhani (1 Point) October 10, 2009 at 3:08 am

      @DarkOs: Yes the article was meant to explain the basic charting needs itself because that is what most people need.

      As for the hidden advertisement part, some people liked the charts and wanted to know what has been used to create them. So I could not keep that info away from them :)

      Flag as inappropriate
  13. Add point Subtract point
    Tutorials007 (1 Point) October 8, 2009 at 2:47 pm

    I prefer FusionCharts for all my charting jobs (php).

    Flag as inappropriate
  14. Add point Subtract point

    gran post!
    linkeame… shadowswind.com

    Flag as inappropriate
  15. Add point Subtract point
    Ted Rex (1 Point) October 1, 2009 at 9:31 am

    Just posted a link to this on my design blog:
    designthoughtfortheday.blogspot.com

    Nice work!

    Flag as inappropriate
  16. Add point Subtract point
    Byron Igoe (1 Point) October 1, 2009 at 9:05 am

    This is fine for simple charts, but what about more sophisticated ones like those listed at http://chart.inetsoft.com/gallery.html ?

    Flag as inappropriate
  17. Add point Subtract point
    Web 2.0 (2 Points) September 30, 2009 at 2:52 pm

    Really useful, great work :)

    Flag as inappropriate
  18. Add point Subtract point
    Sanket Nadhani (1 Point) September 30, 2009 at 1:16 pm

    @lowlight & @jake: I have used FusionCharts (www.fusioncharts.com) for creating the charts. I am from the FusionCharts team itself, so I am glad you asked that question:)

    @ashfame & @jeroen: Thanks for your kind words.

    Flag as inappropriate
  19. Add point Subtract point
    Nitin Kaumr (1 Point) September 30, 2009 at 12:02 pm

    Really cool and informative.Quite an eye opener actually.
    Looking forward to further posts.
    cheers!

    Flag as inappropriate
  20. Add point Subtract point

    You explained it very well. Bookmarked it for use when I will be using charts in my final year project.

    Flag as inappropriate
  21. Add point Subtract point
    Jake McCluskey (1 Point) September 30, 2009 at 11:11 am

    I was wondering about what software you recommend for creating charts. I use excel but is there something better out there?

    Flag as inappropriate
  22. Add point Subtract point
    jeroen Ransijn (1 Point) September 30, 2009 at 10:56 am

    Nice explanations! Will certainly take a look at this next time I make a graph! Thank you. :D

    Flag as inappropriate
  23. Add point Subtract point
    lowlight @ HCW (1 Point) September 30, 2009 at 9:54 am

    Hey those charts are really nice, what did you use to make them?

    Flag as inappropriate