Line Chart

Line graphs are useful for identifying patterns and trends in the data such as seasonal effects, large changes and turning points. Line charts are often used to show time series data. They show how one or more variables vary over a continuous period of time. Line charts can be used to display changes over the same period of time for one or more groups. They show the rate of change (slope) between individual data points.

Multiple data series can be plotted on the same line chart and this is particularly useful for analyzing and comparing the trends in different datasets.

The WCMS Chart is an interactive content type. To see its interactive behavior, move your cursor over the example chart below. Note that you can hide or show a data series by clicking its label in the legend.

When to Use

Line charts are typically used to display changes and show trends. They reveal patterns, trends, relationships and exceptions in data values that are not readily apparent from a table of values. Time series line charts show how one or more variables vary over a continuous period of time.

Other Guidance

Chart Title

Good titles are invaluable. Your chart title should be long enough so your audience can make sense of the chart. A glance at the title should clearly convey what the chart contains. A good title requires a balance between a short title and one with enough descriptive information to clearly describe the chart.

Number of Series Lines

Too many series lines result in visual clutter and make the chart difficult to interpret. One to four lines with a maximum of six lines is recommended. The Chart Builder will support up to nine different colored lines in a line chart. However, if you have more than six sets of quantitative values consider breaking them into a series of related charts.

Grid Lines

In most cases, both horizontal and vertical grid lines should be hidden to reduce chart clutter. Approximate values can be perceived without grid lines.  When the difference in data values is close, horizontal grid lines can be shown to better support data value comparison.

Data Source

The data source makes your graphic more reputable. It also allows those who are interested to dig deeper.

Chart Source Data

Each WCMS chart requires a data file in CSV or JSON format.  Sample data files are available:

• JSON Source Data Example [JSON – 407 B]
• CSV Source Data Example[XLS – 337 B]

Chart Creation in the WCMS

1. From the content browser, create a new content item of the type “Chart.”
2. In the Edit Media form (at the top of  the Chart Editor panel), click “Import Chart Data” and then, when prompted,  click “Enter URL” or “Select Local File” as appropriate for your source data.  (Click “Data Format Help” in the same prompt window for details on formatting your source data.) Once you enter or select your source data file, the WCMS will return you to the Chart Editor.
3. In the Chart Editor, edit the chart components, such as the chart title, data series labels, and X- and Y-axis labels. The editor reflects your changes in real time.

Notes on Chart Editor Options

• Date Formatting: In the field “Date Display Format,” you can change how the dates in the chart timeline display.  For example, the dates in the source data for the example chart below are in MM/DD/YYYY format, but the dates display as abbreviated month names. For help on formatting chart dates, click the link “View date format reference” in the Chart Editor.
• Data Formatting: Depending on the type of numeric values available in your source data, you can change the numeric format — i.e., number of decimal places, rounding rule, etc.  For a list of formats, select the menu option “Data Value Display Format” in the Chart Editor.
• Linking to Additional Resources: To provide a link to supporting information, enter a “Data Source Label” (such as “More Information on This Chart” in the example below) and then enter a URL in “Data Source URL.” The link displays below the chart on the published page.
• Language Settings:  The “Chart Language” option in the Chart Editor panel is for setting the language of the chart labels (such as months of the year). The Language setting in the Basic Options panel is the standard Language setting for WCMS content types.  It categorizes the content for reporting, searching, etc.  When you insert a Spanish-language chart into a page, make certain the page Language setting is Spanish if you want the page to display in the Spanish template.

Inserting a Chart

Once you save your chart, you can insert it into a page via Visual Composer.

Updating a Chart

To change source data from a local file, open the chart item in Edit mode and then click “Import Chart Data” at the top of the Chart Editor. When prompted, select a new or updated data source. Don’t forget to save the chart. If you are working with a source URL instead of a local file, you can simply update the source data.

To change chart settings (such as Data Value Display Format or Date Display Format) open the chart item in Edit mode, make the changes, and then resave the chart.

When you update a published chart, you can simply republish the chart item. You do not have to republish the pages where the chart is used.