From the course: D3.js Essential Training

Unlock this course with a free trial

Join today to access over 25,600 courses taught by industry experts.

Drawing a stack area chart

Drawing a stack area chart - D3.js Tutorial

From the course: D3.js Essential Training

Start my 1-month free trial Buy for my team

Drawing a stack area chart

“

- [Instructor] Sometimes we need to show continuous data split. A stacked area chart can be great for this. Take this area chart. It's showing us time along the X axis, which is continuous, and it shows a volume statistic, the number of unemployed, the along the Y axis. Now try and imagine this without the colors,. It would show us an increase in unemployment, for sure, occurring around about 2009, but you wouldn't get the rich detail. And for me, that's that unemployment has grown across the industries. It's not one particular industry because each of these layers is showing us an industry. We're going to use a D3 generator to build a stacked area chart now. In our last video, we organized the data already. Now we can declare our area generator, which works very similarly to our line generator. So I'm going to say constant area is D3.area. Now with the line generator, it takes an X and a Y. If you think about how area charts work, they're not just in a single Y location. They take up…

Contents