> For the complete documentation index, see [llms.txt](https://docs.microreact.org/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.microreact.org/instructions/adding-and-editing-panels/charts-panel/area-chart.md).

# Area Chart

An area chart shows changes in quantities over time. It's similar to a line chart, with the area under the line filled in with color.

It's best used with multiple lines (**series**), and a continuous primary axis. Generally, the X-axis is the primary axis.

The primary axis can be Quantitative, Temporal, Ordinal, or Nominal. It has an automatic setting, but this can be manually set as well.

![](https://92463871-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCM3b1nzgmsPUEa2xap%2Fuploads%2Fgit-blob-bd83ecdab3f6f8c12452bfdd949a6b98ab960e84%2Fimage%20\(203\).png?alt=media)

### Secondary Timeline

<mark style="color:purple;">**`TIP`**</mark>: A temporal axis works well to show changes over time, and can be used as a secondary timeline on your dashboard. If the data contains a column that aggregates to a larger unit of time (e.g. week number of study), this can be plotted as an aggregated timeline using that column (week number) as the axis. This is a way to simulate the unit changes that are available in the actual timeline panel.

<figure><img src="https://92463871-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCM3b1nzgmsPUEa2xap%2Fuploads%2Fgit-blob-94e84822eff43de93b3c04fa6fa181f465402c47%2Fimage%20(27).png?alt=media" alt=""><figcaption><p>Using an area chart as a secondary timeline, using a temporal axis</p></figcaption></figure>

<figure><img src="https://92463871-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCM3b1nzgmsPUEa2xap%2Fuploads%2Fgit-blob-9a85ceddbcd459043f67baf4e1f1001614d50818%2Fimage%20(21).png?alt=media" alt=""><figcaption><p>Using an area chart as an aggregated secondary timeline, using a week number instead of temporal axis</p></figcaption></figure>

### Interpolation

When choosing your chart type, the default is linear interpolation, but [other options](/instructions/adding-and-editing-panels/charts-panel.md#interpolation) may be more appropriate for your data.
