D3.js in Motion
Curran Kelleher
  • Course duration: 2h 50m
    Estimated full duration: 4h 15m
  • MEAP began September 2017
  • Publication in January 2018 (estimated)

Straight to the point. Pragmatic, no frills.

Giuseppe Caruso, UX Architect and Front-End Developer, Bonsai Studio

See it. Do it. Learn it! D3.js in Motion introduces you to the powerful D3 (version 4!) JavaScript library and teaches you how to use it to create amazing data visualizations for the web. You'll learn through bite-sized video lessons and built-in exercises, so you can put what you learn into practice.

D3.js in Motion teaches you to transform your boring data into a variety of engaging and interactive graphs and charts. You'll start with an introduction to the world of D3 and data visualization by plotting simple data sets onto charts. In each lesson you'll dig deeper, turning your data into readable graphical representations like scatter plots, bar charts, line charts, pie charts, and more. Along the way, you'll discover how to create a fully interactive dashboard featuring multiple visualizations that pan, zoom, and interact with each other!

Table of Contents detailed table of contents

Scatter Plot Odyssey

For Example

Loading Data

Basic Scatter Plot

Margin Convention


Axis Customization

Axis Labels

Using Color

Color Legend

Visualization Idioms

World Market Analysis

Point Scales

Bar Chart

Tilted Tick Labels

Horizontal Bar Chart

Time Scales

Line Chart

Pie Chart

Dynamic Data

Shopping App Idea

General Update Pattern

Bars Behind Text

Managing One Thing

Managing Nested Elements

Using Classes

Animated Transitions

Reusable Components

Splitting Charts

Multiple Lines

Stacked Area

Stacked and Grouped Bars

Small Multiples

Truthful Sizing


Base Map


Bubble Map

Pies on a Map




Panning and Zooming

Linked Views


About the subject

Used by thousands of websites the world over, D3 is a JavaScript library that represents data graphically. D3 makes it easy to create dynamic, interactive visualizations for the web. You start with a structure, dataset, or algorithm and then programmatically generate static, animated, and interactive images that scale to any screen.


This course is perfect for developers with basic HTML, CSS, and JavaScript skills. No experience with D3 is required.

What you will learn

  • A tour of D3's features and abilities
  • Constructing your own custom visualizations tailored to your data
  • How to make scatter plots, bar charts, line charts, pie charts, and more
  • Patterns for creating reusable interactive visualization components
  • Interactions including hovering, clicking, zooming, panning, and brushing
  • Building fully-interactive dashboards

About the instructor

Curran Kelleher specializes in using and teaching D3.js. He has been working in the field of data visualization since 2005, and is fascinated by techniques for the visual presentation of data.

Manning Early Access Program (MEAP) Watch raw videos as they are added, and get the entire course, complete with transcript and exercises, when it is finished.
D3.js in Motion added to cart
continue shopping
go to cart

MEAP liveVideo $79.99

I don't know of anything close to this in free online resources.

Michael Bright, Pre-Sales Solution Architect, HPE Grenoble, France

A very good and very clear introduction to D3.js for beginners and intermediate level developers.

Alain Couniot, Head of Enterprise Architecture, STIB-MIVB, Belgium

Explains concepts in a detail rarely found in blog posts or books and has a smooth progression from concept to concept. It will take you from zero to hero!

Ray Lugo, Senior Associate, Ernst & Young