O'Reilly logo

Expert Data Visualization by Jos Dirksen

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Setting up the animations and the graphs

As we've seen in Chapter 2, Basic Charts and Shapes, we can draw lines in D3 using a d3.line function. To draw a line, you pass in a function which is used to determine the x coordinate based on the data, and a function used to determine the y coordinate. D3 also allows you to pass in what the line should look like. Should it be curved, closed, straight, or one of the other options (more options can be found here: ). If you don't specify anything, you will get a linear curve, which is just a polyline through all the points:

If we don't want direct lines between the points, we could also use the d3.curveStep ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required