Bar Charts Design Only
Bar charts are used to compare the relationship of a data set against two primary measurements or points of interest, illustrated along horizontal and vertical axes (x-axis and y-axis).
Vertical Bar Chart
Bar charts are the most versatile chart type, useful for most situations where you need to compare values. The vertical bar chart is preferred in most instances. See other variations below for specific use cases.
Variations
- Vertical Bar Chart (shown above)
- Horizontal Bar Chart
- Stacked Bar Chart
- Percent Stacked Bar Chart
- Histogram
Usage
Bar charts can be used in many use cases and are generally easy to understand and adaptable. However, when change over time is of primary importance, consider a Line Graph instead.
Behaviors
The bar charts have several interactions available for accessing additional details. All of these functions are optional.
- Drill Down View: On click users can drill down to the next level of information. If there are no further steps in the hierarchy, detailed information should be displayed in a Tooltip or Popover. Drilling down will prompt Drilldown Nav to appear.
- On hover/click of a single bar, the popover or tooltip displays details only for that portion of the data.
- On click/hover of the background of the visualization, a popover displays values for all the elements at that position on the chart.
- Additional Interactions: functionality such as drawing, adding baselines, making notations, etc. may be added. These are most commonly accessed from the Toolbar.
Variations
Horizontal Bar Chart
Horizontal bar charts allow users to compare values in different categories with the ability to convey ranking by position on the chart. If no ranking is intended, use another default order (such as alphabetical).
When to Use
- When communicating a ranking/order of the categories.
- When additional space is required to fit longer category names.
Stacked Bar Chart
Stacked bar charts are a cross between bar charts and pie charts. They should be used when the general makeup of a metric is helpful in understanding how the value of that metric was reached.
Displaying too many categories in a single bar can render this chart unreadable, so consider it’s usage carefully and try to limit the number of categories to four or fewer.
Percent Stacked Bar Chart
The only distinction between this chart type and the standard Stacked Bar Chart is that the bars extend the full width or height, placing all elements on a percent scale.
Similar to the Stacked Bar Chart above, displaying too many categories in a single bar can render this chart unreadable, so consider it’s usage carefully and try to limit the number of categories to four or fewer.
When to Use
- When the proportions of the elements that make up the metric are important and need to be compared.
When Not to Use
- When the relative sizes of the elements themselves is important. In those cases use a stacked bar chart.
Histogram
A histogram is a particular form of bar chart that shows on its y-axis how frequently a given value on the x-axis comes up. This functionality is often used for quality control and to verify insights gleaned from other visualizations. All histograms should be built with continuous variables like numbers or letters.
When to Use
- To show how often each one of a series of values occurs. For example: the distribution of salaries across your organization.
When Not to Use
- When the frequency of values is irrelevant to the use case.
Other Considerations
How broadly or narrowly the values are defined impacts the steepness of the curve. Consider the following:
