3.3.2 Column Charts

Owned by Brendan Codrington
Last updated: Oct 23, 2017
3 min read

Comparison


Setting TypeInstructions
Series 

Border Colour Code: #fcfcfc
*Use colours from Colour Palette

Labels

Font Colour Code: #36424A

Horizontal Axis

Axis Colour Code: #fcfcfc
Font Colour Code: #36424A

Vertical Axis


Design Recommendations: Simplify the column/bar chart by reducing the non-data ink. Display the column labels and remove axes/gridlines 

Categorical Data

Setting TypeInstructions
Series

Border Colour Code: #fcfcfc
*Use colours from Colour Palette
Labels

Font Colour Code: #36424A

Gridlines

Horizontal Axis

Axis Colour Code: #36424A

Vertical Axis

Individual Values Through Time

Setting TypeInstructions

Chart

Enable Unit Selection and Date Slider in Chart Settings> Interaction:

Series 

Border Colour Code:
#fcfcfc
*Use colours from Colour Palette

Horizontal Axis

Axis Colour Code: #36424A

Vertical Axis 

Trend Breakdown

Setting TypeInstructions

Chart

Enable Visible Series Selection:

Series

Border Colour Code: #fcfcfc
*Use colours from Colour Palette

Horizontal Axis

Axis Colour Code: #36424A

Vertical Axis

Axis Colour Code: #36424A

Design Recommendations: Visible Series Selection allows users to select which series to display by checking the boxes. It is handy for users to view individual metrics value as well as overall values.


Sum

Setting TypeInstruction
Chart

*Use colours from Colour Palette

Labels

Font Colour Code: #36424A

Horizontal Axis

Axis Colour Code: #fcfcfc

Vertical Axis


Top

In this section