A10: Black Hat/White Hat Visualization

By Andrew B. Moore

Raw JS: black-hat_line.js white-hat_line.js

Black Hat Visualization:

This visualization is horrible for several reasons:

• The title is biased and influences the reader's perception before even viewing the chart.
  The caption is also emotionally charged and nonobjective, also influencing the reader's perception before viewing the chart.
• The title and caption are overlaid onto the chart (increases cognitive load).
• The data has not been cleaned, so monthly data for nearly two centuries (very high resolution) is being represented on a minuscule canvas.
  This lack of cleaning/processing also obfuscates the rise in yearly averages, which can only be seen by looking at density of lines (darker part of the gradient), which is practically impossible in a canvas this small, and ridiculously inaccessible.
• The Y axis uses a Log scale... need I say more? (it obscures any kind of rise and makes lower temperatures appear much lower).
• The Y axis also does not label units, so it is entirely unclear what the numbers mean. Are they in Fahrenheit? Celsius? Or Kelvin (we'd all be dead)?
• In essence, this chart is designed to be unreadable and manipulative.

White Hat Visualization:

Data: Climate Change: Earth Surface Temperature, Provided by: Berkeley Earth, Kaggle Team, Kristen Sissener
Original data was collected monthly, this visualization uses a yearly average of the monthly data.
Note: The Y axis begins at 6.6℃, this was done to reduce unnecessary white space below the plotted line.

This visualization is better than the first because:

• The title is unbiased and informative; the caption below it transparently describes data manipulation and indicates the Y axis's shortening to the reader.
• The text is properly aligned and does not overlap the chart (accessible and readable).
• The data has been cleaned in a manner which more accurately represents the rise of global temperatures over time.
• The Y axis has been labeled with the proper unit (this is also indicated in the caption with "6.6℃").
• The Y axis uses a linear scale, which the majority of viewers will expect and automatically read it as (as opposed to a log scale).
• While the Y axis starting above 0℃ may produce a qualm, it is transparently indicated in the caption.