A preview of each build

Each chapter focuses on a specific build. The completed build code for each chapter can be found at: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide.

Using SVG to create images using code

In this chapter, we learn how to render shapes in the browser, using SVG. We'll cover shapes such as these:

• Circles:

• Lines:

• Rectangles:

• Ellipses:

• Polygons:

• Polylines:

• Cubic Bezier Curves:

The completed code for this section can be found here: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide/tree/master/Chapter02.

Building an interactive scatter plot

In this chapter, you'll learn how to plot points on a graph to create a scatter plot. It will look a bit like this:

The completed code for this section can be found here: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide/tree/master/Chapter03.

Making a basic scatter plot interactive

This chapter builds on the previous one, adding interactive functionality that allows you to do the following:

• Create new points:

• Remove points:

• Update points:

• Zoom and pan:

The completed code for this section can be found here: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide/tree/master/Chapter04.

Creating a bar graph using a data file

In this chapter, we'll learn how to use AJAX to make an asynchronous call, after the page has loaded, to retrieve some JSON data and render it as a bar graph. It should look as follows:

The completed code for this section can be found here: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide/tree/master/Chapter05.

Animating SVG elements to create an interactive pie chart

In this chapter, we'll learn how to make a pie chart:

Then we'll turn it into a donut chart:

And then we'll create functionality so that the user can remove a section of the chart and it will close the gap with a smooth transition:

The completed code for this section can be found here: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide/tree/master/Chapter06.

Using physics to create a force-directed graph

In this chapter, we'll graph relationships between people with a force-directed graph. It will look as follows:

The completed code for this section can be found here: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide/tree/master/Chapter07.

Mapping

In Chapter 8, Mapping, we'll learn how to use GeoJSON data to create a map of the world. It will look as follows:

The completed code for this section can be found here: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide/tree/master/Chapter08.