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.

Positioning and formatting our axis

Positioning and formatting our axis - D3.js Tutorial

From the course: D3.js Essential Training

Start my 1-month free trial Buy for my team

Positioning and formatting our axis

“

- [Instructor] D3 gives you powerful control over access formatting with simple commands like .nice to round off data values effortlessly. In this video we'll explore some key options that make D3's axis generator so flexible and useful. In the last video we made our first axis. Now let's check the DOM and see what we've been given. We have our svg, which contains our chart group. And you can see if you look at the webpage part as I hover, you can see that the group is just that sort of shaded blue section. So it's got the margins applied around it. And then if we drill down a bit further, we have our axis group and our line group. Now we want to focus in on the axis here. So let's see what we've been given. And bear in mind we didn't have to add any of these. We made one command, which was .call, and we've been given a path which runs from top to bottom and then a series of groups corresponding to our ticks. And if we expand each of these groups, we get a line and a label. So tick…

Contents