From the course: D3.js Essential Training

Unlock this course with a free trial

Join today to access over 24,900 courses taught by industry experts.

Creating a time scale

Creating a time scale - D3.js Tutorial

From the course: D3.js Essential Training

Creating a time scale

- [Narrator] Now we're going to explore creating a time or date-based axis. And to do that, first we have to create a time-based scale. Dates can be tricky in any language. And in this video, we'll explore how to handle them properly using a new type of scale called scale time. You can see that I have updated the data object. So instead of a numeric value for day, previously this was 012 and so forth. We have dates, but they're strings. So if we were to try and refresh our page, it's going to throw us an error because it can't make any sense of the days. It's trying to make a path data and it can't even work out where to put the virtual pin to start with, which is fair enough. So let's set about making a timescale now using this data, and this is going to be for our X axis, so we're going to make an X scale and that's called scale time like so, and it has a domain and a range. Now with the Y scale, our inputs, our input went from zero to the maximum because we generally read charts…

Contents