From the course: D3.js Essential Training for Data Scientists

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Drawing an area chart

Drawing an area chart - D3.js Tutorial

From the course: D3.js Essential Training for Data Scientists

Start my 1-month free trial

Drawing an area chart

“

- [Instructor] Day three contains several generators in addition to line, including area, arc, cord and symbol. Let's create an area chart using the area generator. Unlike the line generator, the area generator produces a closed shape, i.e. one that can be filled. Take a new javascript sheet, and save it as area.js Now we need to re-reference our d3.html file like so, save that, declare a variable dataArray and we're gonna fill it with 17 random numbers. Now they're not actually that random in my case because, as you can see, they're all going up, but you can be a bit more experimental with yours if you like, and the reason for using 17 of them will become clear in a moment. You can copy mine or use your own. Alright, I think that's about 17. Next we're gonna declare another variable, and we're gonna call it dataYears, var dataYears is array, and this time we're gonna fill it with years. We're gonna start at 2000 and increment, and there we have it, that's why we wanted 17 data points…

Contents