Exercise 6: Configuring a Single-Series Chart with Confidence Intervals

COVE Data Definition Exercises

Learning Objectives

A chart showing multiple data series is often necessary to support a public health message, but sometimes the simplicity of a single-series chart is needed. In addition to focusing the end users’ attention on a single series of data, a single-series bar chart can include confidence intervals (CIs) in the visualization.

This exercise focuses on the building of a single-series bar chart with CI values. It also introduces a few display options not covered in the previous charting exercises.

(For explanations of the concepts demonstrated in this series of exercises, see Defining Data for Visualization.  For descriptions of the other exercises in this series, see the Exercise Index.)

Source Data

This exercise uses the following single-series dataset.

Screenshot of single-series data with columns for high and low CI values

View source file [XLS – 225 B]

Visualization You’re Building

Note the following features with the example chart below:

  • The legend is hidden to reduce clutter. This is often a good idea with single-series charts.  (Tip:  When hiding the legend, make certain there is adequate labeling to indicate what’s visualized.)
  • The chart title references the confidence intervals (CIs). When including extra visual elements in a chart (such as CI values), make certain you explain the elements in supporting text such as the chart title, axis labels, legend title, etc.
  • The numbers on the value axis are abbreviated with the standard “K” for 1,000.
  • A light palette is used for the bars so that the CI lines are easy to see.

Step-by-Step Instructions

Create the Content Item

  1. From the WCMS content (folder) browser, select New Content Item, and when prompted, select Data Visualization.
  2. Click the button Open Visualization Editor.
  3. On the Choose Visualization Type tab, select Bar.

Import the Data

  1. On the Import Data tab, select Load from URL and then copy and paste the following URL:
    https://wwwdev.cdc.gov/wcms/4.0/cdc-wp/data-presentation/data/exercise-data/single-series-chart-with-CI-values.csv
  2. Click Load.
  3. Select Vertical for the Orientation.
  4. When asked whether there are multiple series, select No.
  5. Click Configure your visualization.

Configure Your Visualization

  1. In the Data Series panel, select Total Cases.  (Because the source dataset has only one data series, you must select the column that contains the values to be charted.  As you may recall, for the multi-series charts in Exercises 1 – 3, you selected the series labels, such as “Male” and “Female.”)
  2. While in the Data Series panel, select the columns for the Confidence Intervals.
  3. In the Date/Category Axis panel, select Year.  (Leave the Data Scaling Type as Categorical.)
  4. Click Done in the preview area and preview your chart.

Fine-Tune the Visualization

Compare your chart with the example in this document and see how well you can fine-tune your chart (and data table) before reviewing the instructions below.

  • In the General panel, set the chart title and other supporting text as you like.
  • Note that the CI values have not been included automatically in the table and tooltips. In the Columns panel, add columns for the upper- and lower-CI values.  Check Show in Data Table and Show in Tooltip for both. Also check Add Commas to Numbers.
  • In the Legend panel, check Hide Legend.
  • In the Left Value Axis panel, add a Label (such as “Total Cases”).
  • While in the Left Value Axis panel, check Abbreviate Axis Values and adjust the Size (Width) as necessary. Note the formatting change to the numbers on the axis.
  • Note that the numbers in the data table for Total Cases remain unabbreviated, so you should check Add Commas to better format those numbers.
  • Also in the Left Value Axis panel, check Show Gridlines.
  • In the Data Table panel, add an Index Column Header (“Year”) so that you don’t have an empty header cell.
  • In the Visual panel, select a light palette so that the CI lines are easy to see.  (The example chart uses the third non-sequential palette from the left.)