Building a stacked area chart

In the Creating an area chart recipe in Chapter 8, Chart Them Up, we explored how a basic layered area chart can be implemented using D3. In this recipe, we will build over what we covered in the area chart recipe to implement a stacked area chart. Stacked area chart is a variation of the standard area chart in which different areas are stacked on top of each other giving your audience the ability to compare not only different data series individually but also their relationship to the total in proportion.

Getting ready

Open your local copy of the following file in your web browser: https://github.com/NickQiZhu/d3-cookbook-v2/blob/master/src/chapter9/stacked-area-chart.html

How to do it...

This recipe is built over what we had implemented in Chapter 8, Chart Them Up; therefore, in the following code example, only the parts that are particularly relevant to the stacked area chart are included:

<script type="text/javascript"> 
function stackedAreaChart...