From the course: D3.js Essential Training

Unlock this course with a free trial

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

Solution: Line chart with missing data

Solution: Line chart with missing data - D3.js Tutorial

From the course: D3.js Essential Training

Start my 1-month free trial Buy for my team

Solution: Line chart with missing data

“

(upbeat music) - [Instructor] Okay, so I hope you found that clear and reasonably straightforward. You can use a lot of the code that you already had to make this challenge easier. So we've got the margin object, we've got the data, we've got width, height, and SVG. We no longer need to add these things in a grid, and we are going to use a line generator. So let's reactivate this one. And we don't need to add multiple groups based on data, so I'm going to comment that out. But I'm going to keep it, because maybe some of the syntax might be useful. I don't need any special curves in it this time. So let's look at our data. We've got day 0 through 6 and temperatures 12 up to 20 and back down to 16. So what we don't have anymore is d.x and d.y. Now, because we're doing it over time and our days are numbered, our x-axis will be time, d.day, and our y-axis is going to be the temperature and we can probably times that by a bit more, and get rid of that completely. So there's our generator…

Contents