Book Image

D3.js 4.x Data Visualization - Third Edition

By : Aendrew Rininsland, Swizec Teller
Book Image

D3.js 4.x Data Visualization - Third Edition

By: Aendrew Rininsland, Swizec Teller

Overview of this book

Want to get started with impressive interactive visualizations and implement them in your daily tasks? This book offers the perfect solution-D3.js. It has emerged as the most popular tool for data visualization. This book will teach you how to implement the features of the latest version of D3 while writing JavaScript using the newest tools and technique You will start by setting up the D3 environment and making your first basic bar chart. You will then build stunning SVG and Canvas-based data visualizations while writing testable, extensible code,as accurate and informative as it is visually stimulating. Step-by-step examples walk you through creating, integrating, and debugging different types of visualization and will have you building basic visualizations (such as bar, line, and scatter graphs) in no time. By the end of this book, you will have mastered the techniques necessary to successfully visualize data and will be ready to use D3 to transform any data into an engaging and sophisticated visualization.
Table of Contents (18 chapters)
Title Page
About the Authors
About the Author2
About the Reviewer
Customer Feedback
Shape Primitives of D3

Chapter 1. Getting Started with D3, ES2017, and Node.js

Data-Driven Documents (D3), developed by Mike Bostock and the D3 community in 2011, is the successor to Bostock's earlier Protovis library. It allows pixel-perfect rendering of data by abstracting the calculation of things such as scales and axes into an easy-to-use Domain-Specific Language (DSL), and uses idioms that should be immediately familiar to anyone with experience of using the popular jQuery JavaScript library. Much like jQuery, in D3, you operate on elements by selecting and then manipulating them via a chain of modifier functions. Especially within the context of data visualization, this declarative approach makes using it easier and more enjoyable than a lot of other tools out there. The official website,, features many great examples that show off the power of D3, but understanding them is tricky to start with. After finishing with this book, you should be able to understand D3 well enough to figure out the examples, tweaking them to fit your needs. If you want to follow the development of D3 more closely, check out the source code hosted on GitHub at

In this chapter, we'll lay the foundations of what you'll need to run all the examples in the book. I'll explain how you can start writing ECMAScript 2017 (ES2017)--the latest and most advanced version of JavaScript--and show you how to use Babel to transpile it to ES5, allowing your modern JavaScript to be run on any browser. We'll then cover the basics of using D3 v4 to render a basic chart.