Make the First Choice
| Question or detail | Chart | What to check |
|---|---|---|
| Compare changes in several series | Line Chart | Separate paths usually remain more readable than overlapping filled regions. |
| Emphasize one non-negative quantity | Area Chart | Fill to zero when the filled magnitude is the intended message. |
| Show components of a changing total | Stacked Area Chart | Additive components with a defined stacking order and consistent units. |
WORKED EXAMPLE / ILLUSTRATIVE DATA
Read the Same Monthly Revenue Two Ways
Suppose a fictional service reports the following monthly revenue. A line can highlight the March dip. A fill to zero emphasizes the magnitude reached each month.
| Month | Revenue ($) |
|---|---|
| January | 20 |
| February | 35 |
| March | 30 |
| April | 50 |
The total over these four months is $135. Neither a line nor an ordinary area chart turns the displayed values into a running total. A cumulative series would instead plot $20, $55, $85, and $135.
Choose the Baseline Deliberately
With a line, a limited vertical range can make small changes readable if the axis is clearly labeled. With an area fill, that same limited range changes the visible filled magnitude. Use zero when readers are meant to judge an amount from the area above the baseline.
A fill can also represent a band between two series, such as upper and lower bounds. Label it as a band; do not describe every filled chart as a part-to-whole display.
Distinguish Overlap From Stacking
Two transparent areas drawn from zero overlap; their top edge is not the combined total. A stacked area places one series on top of another so the outer boundary shows the sum at each time point.
Stacking requires compatible units and parts that can meaningfully be added. Only the bottom band has a fixed baseline. If comparing the change of each component is the main task, separate lines or small multiples can be clearer.
Keep the Same Time and Missing-Data Rules
Both charts need ordered time values, clear reporting intervals, and an explicit treatment of missing observations. Filling underneath a line does not justify replacing a missing month with zero.
The ChartTypes line and area pages use separate illustrative datasets. Within either page, all library tabs use the same values, so you can compare implementations without changing that page’s input.
Before You Publish
- State whether values are period totals or cumulative totals.
- Make the baseline and any stacking explicit.
- Use consistent units and time intervals.
Explore Working Examples
Open a chart to inspect its sample data and compare code in six libraries.