D3.js: Cutting-edge Data Visualization

Turn your raw data into real knowledge by creating and deploying complex data visualizations with D3.js
Preview in Mapt
Code Files

D3.js: Cutting-edge Data Visualization

Ændrew Rininsland, Michael Heydt, Pablo Navarro Castillo

Turn your raw data into real knowledge by creating and deploying complex data visualizations with D3.js
Mapt Subscription
FREE
$29.99/m after trial
eBook
$50.40
RRP $71.99
Save 29%
What do I get with a Mapt Pro subscription?
  • Unlimited access to all Packt’s 5,000+ eBooks and Videos
  • Early Access content, Progress Tracking, and Assessments
  • 1 Free eBook or Video to download and keep every month after trial
What do I get with an eBook?
  • Download this book in EPUB, PDF, MOBI formats
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
What do I get with Print & eBook?
  • Get a paperback copy of the book delivered to you
  • Download this book in EPUB, PDF, MOBI formats
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
What do I get with a Video?
  • Download this Video course in MP4 format
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
$0.00
$50.40
$29.99 p/m after trial
RRP $71.99
Subscription
eBook
Start 14 Day Trial

Frequently bought together


D3.js: Cutting-edge Data Visualization Book Cover
D3.js: Cutting-edge Data Visualization
$ 71.99
$ 50.40
D3.js 4.x Data Visualization - Third Edition Book Cover
D3.js 4.x Data Visualization - Third Edition
$ 31.99
$ 22.40
Buy 2 for $35.00
Save $68.98
Add to Cart

Book Details

ISBN 139781787281776
Paperback868 pages

Book Description

D3 has emerged as one of the leading platforms to develop beautiful, interactive visualizations over the web. We begin the course by setting up a strong foundation, then build on this foundation as we take you through the entire world of reimagining data using interactive, animated visualizations created in D3.js.

In the first module, we cover the various features of D3.js to build a wide range of visualizations. We also focus on the entire process of representing data through visualizations. By the end of this module, you will be ready to use D3 to transform any data into a more engaging and sophisticated visualization.

In the next module, you will learn to master the creation of graphical elements from data. Using practical examples provided, you will quickly get to grips with the features of D3.js and use this learning to create your own spectacular data visualizations with D3.js.

Over the last leg of this course, you will get acquainted with how to integrate D3 with mapping libraries to provide reverse geocoding and interactive maps among many other advanced features of D3. This module culminates by showing you how to create enterprise-level dashboards to display real-time data.

This Learning Path combines some of the best that Packt has to offer in one complete, curated package. It includes content from the following Packt products:

  • Learning D3.js Data Visualization, Second Edition by Andrew H. Rininsland
  • D3.js By Example by Michael Heydt
  • Mastering D3.js by Pablo Navarro Castillo

Table of Contents

Chapter 1: Getting Started with D3, ES2016, and Node.js
What is D3.js?
What's ES2016?
Summary
Chapter 2: A Primer on DOM, SVG, and CSS
DOM
What exactly did we do here?
Scalable Vector Graphics
Summary
Chapter 3: Making Data Useful
Thinking about data functionally
Loading data
Scales
Geography
Summary
Chapter 4: Defining the User Experience – Animation and Interaction
Animation
Animation with transitions
Interacting with the user
Behaviors
Summary
Chapter 5: Layouts – D3's Black Magic
What are layouts and why should you care?
Normal layouts
Using the histogram layout
Baking a fresh 'n' delicious pie chart
Showing popularity through time with stack
Highlighting connections with chord
Hierarchical layouts
Drawing a tree
Showing clusters
Summary
Chapter 6: D3 on the Server with Node.js
Readying the environment
All aboard the Express train to Server Town!
Proximity detection and the Voronoi geom
Rendering in Canvas on the server
Deploying to Heroku
Summary
Chapter 7: Designing Good Data Visualizations
Clarity, honesty, and sense of purpose
Helping your audience understand scale
Using color effectively
Understanding your audience (or "trying not to forget about mobile")
Summary
Chapter 8: Having Confidence in Your Visualizations
Linting all the things
Static type checking with TypeScript and Flow
Behavior-driven development with Karma and Mocha Chai
Summary
Chapter 9: Getting Started with D3.js
A brief overview of D3.js
Tools for creating and sharing D3.js visualizations
Google Chrome and Developer tools
Hello World – D3.js style
Examining the DOM generated by D3.js
Summary
Chapter 10: Selections and Data Binding
D3.js selections
D3.js and data binding
Summary
Chapter 11: Creating Visuals with SVG
Introducing SVG
The basic shapes provided by SVG
Applying CSS styles to SVG elements
Strokes, caps, and dashes
Applying SVG transforms
Groups
Transparency
Layers
Summary
Chapter 12: Creating a Bar Graph
The basic bar graph
Margins and axes
Summary
Chapter 13: Using Data and Scales
Data
Scales
Summary
Chapter 14: Creating Scatter and Bubble Plots
Creating scatter plots
Creating a bubble plot
Summary
Chapter 15: Creating Animated Visuals
Introduction to animation
Adding a fifth dimension to a bubble plot – time
Summary
Chapter 16: Adding User Interactivity
Handling mouse events
Using behaviors to drag, pan, and zoom
Enhancing a bar graph with interactivity
Highlighting selected items using brushes
Summary
Chapter 17: Complex Shapes Using Paths
An overview of path data generators
Drawing line graphs using interpolators
Summary
Chapter 18: Using Layouts to Visualize Series and Hierarchical Data
Using stacked layouts
Visualizing hierarchical data
Representing relationships with chord diagrams
Techniques to demonstrate the flow of information
Summary
Chapter 19: Visualizing Information Networks
An overview of force-directed graphs
A simple force-directed graph
Using link distance to spread out the nodes
Adding repulsion to nodes for preventing crossed links
Summary
Chapter 20: Creating Maps with GeoJSON and TopoJSON
Introducing TopoJSON and GeoJSON
Creating a map of the United States
Styling the map of the United States
Creating a flat map of the world
Spicing up a globe
Adding interactivity to maps
Annotating a map
Summary
Chapter 21: Combining D3.js and AngularJS
An overview of composite visualization
Creating a bar graph using AngularJS
Adding a second directive for a donut
Adding a detail view and interactivity
Updating graphs upon the modification of details data
Summary
Chapter 22: Data Visualization
Defining data visualization
Introducing the D3 library
Summary
Chapter 23: Reusable Charts
Creating reusable charts
Using the barcode chart
Creating a layout algorithm
Summary
Chapter 24: Creating Visualizations without SVG
SVG support in the browser market
Visualizations without SVG
Polyfilling
Using canvas and D3
Summary
Chapter 25: Creating a Color Picker with D3
Creating a slider control
Creating a color picker
Summary
Chapter 26: Creating User Interface Elements
Highlighting chart elements
Creating tooltips
Selecting a range with brushing
Summary
Chapter 27: Interaction between Charts
Learning the basics of Backbone
The stock explorer application
Summary
Chapter 28: Creating a Charting Package
The development workflow
Creating the package contents
The project setup
Using the package in other projects
Summary
Chapter 29: Data-driven Applications
Creating the application
Hosting the visualization with GitHub Pages
Hosting the visualization in Amazon S3
Summary
Chapter 30: Creating a Dashboard
Defining a dashboard
Good practices in dashboard design
Making a dashboard
Summary
Chapter 31: Creating Maps
Obtaining geographic data
Creating maps with D3
Summary
Chapter 32: Creating Advanced Maps
Using cartographic projections
Creating a rotating globe
Creating an interactive star map
Projecting raster images with D3
Summary
Chapter 33: Creating a Real-time Application
Collaborating in real time with Firebase
Creating a Twitter explorer application
Creating the streaming server
Creating the client application
Summary

What You Will Learn

  • Gain a solid understanding of the common D3 development idioms
  • Find out how to write basic D3 code for servers using Node.js
  • Install and use D3.js to create HTML elements within a document
  • Create and style graphical elements such as circles, ellipses, rectangles, lines, paths, and text using SVG
  • Turn your data into bar and scatter charts, and add margins, axes, labels, and legends
  • Use D3.js generators to perform the magic of creating complex visualizations from data
  • Add interactivity to your visualizations, including tool-tips, sorting, hover-to-highlight, and grouping and dragging of visuals
  • Write, test, and distribute a D3-based charting package
  • Make a real-time application with Node and D3

Authors

Table of Contents

Chapter 1: Getting Started with D3, ES2016, and Node.js
What is D3.js?
What's ES2016?
Summary
Chapter 2: A Primer on DOM, SVG, and CSS
DOM
What exactly did we do here?
Scalable Vector Graphics
Summary
Chapter 3: Making Data Useful
Thinking about data functionally
Loading data
Scales
Geography
Summary
Chapter 4: Defining the User Experience – Animation and Interaction
Animation
Animation with transitions
Interacting with the user
Behaviors
Summary
Chapter 5: Layouts – D3's Black Magic
What are layouts and why should you care?
Normal layouts
Using the histogram layout
Baking a fresh 'n' delicious pie chart
Showing popularity through time with stack
Highlighting connections with chord
Hierarchical layouts
Drawing a tree
Showing clusters
Summary
Chapter 6: D3 on the Server with Node.js
Readying the environment
All aboard the Express train to Server Town!
Proximity detection and the Voronoi geom
Rendering in Canvas on the server
Deploying to Heroku
Summary
Chapter 7: Designing Good Data Visualizations
Clarity, honesty, and sense of purpose
Helping your audience understand scale
Using color effectively
Understanding your audience (or "trying not to forget about mobile")
Summary
Chapter 8: Having Confidence in Your Visualizations
Linting all the things
Static type checking with TypeScript and Flow
Behavior-driven development with Karma and Mocha Chai
Summary
Chapter 9: Getting Started with D3.js
A brief overview of D3.js
Tools for creating and sharing D3.js visualizations
Google Chrome and Developer tools
Hello World – D3.js style
Examining the DOM generated by D3.js
Summary
Chapter 10: Selections and Data Binding
D3.js selections
D3.js and data binding
Summary
Chapter 11: Creating Visuals with SVG
Introducing SVG
The basic shapes provided by SVG
Applying CSS styles to SVG elements
Strokes, caps, and dashes
Applying SVG transforms
Groups
Transparency
Layers
Summary
Chapter 12: Creating a Bar Graph
The basic bar graph
Margins and axes
Summary
Chapter 13: Using Data and Scales
Data
Scales
Summary
Chapter 14: Creating Scatter and Bubble Plots
Creating scatter plots
Creating a bubble plot
Summary
Chapter 15: Creating Animated Visuals
Introduction to animation
Adding a fifth dimension to a bubble plot – time
Summary
Chapter 16: Adding User Interactivity
Handling mouse events
Using behaviors to drag, pan, and zoom
Enhancing a bar graph with interactivity
Highlighting selected items using brushes
Summary
Chapter 17: Complex Shapes Using Paths
An overview of path data generators
Drawing line graphs using interpolators
Summary
Chapter 18: Using Layouts to Visualize Series and Hierarchical Data
Using stacked layouts
Visualizing hierarchical data
Representing relationships with chord diagrams
Techniques to demonstrate the flow of information
Summary
Chapter 19: Visualizing Information Networks
An overview of force-directed graphs
A simple force-directed graph
Using link distance to spread out the nodes
Adding repulsion to nodes for preventing crossed links
Summary
Chapter 20: Creating Maps with GeoJSON and TopoJSON
Introducing TopoJSON and GeoJSON
Creating a map of the United States
Styling the map of the United States
Creating a flat map of the world
Spicing up a globe
Adding interactivity to maps
Annotating a map
Summary
Chapter 21: Combining D3.js and AngularJS
An overview of composite visualization
Creating a bar graph using AngularJS
Adding a second directive for a donut
Adding a detail view and interactivity
Updating graphs upon the modification of details data
Summary
Chapter 22: Data Visualization
Defining data visualization
Introducing the D3 library
Summary
Chapter 23: Reusable Charts
Creating reusable charts
Using the barcode chart
Creating a layout algorithm
Summary
Chapter 24: Creating Visualizations without SVG
SVG support in the browser market
Visualizations without SVG
Polyfilling
Using canvas and D3
Summary
Chapter 25: Creating a Color Picker with D3
Creating a slider control
Creating a color picker
Summary
Chapter 26: Creating User Interface Elements
Highlighting chart elements
Creating tooltips
Selecting a range with brushing
Summary
Chapter 27: Interaction between Charts
Learning the basics of Backbone
The stock explorer application
Summary
Chapter 28: Creating a Charting Package
The development workflow
Creating the package contents
The project setup
Using the package in other projects
Summary
Chapter 29: Data-driven Applications
Creating the application
Hosting the visualization with GitHub Pages
Hosting the visualization in Amazon S3
Summary
Chapter 30: Creating a Dashboard
Defining a dashboard
Good practices in dashboard design
Making a dashboard
Summary
Chapter 31: Creating Maps
Obtaining geographic data
Creating maps with D3
Summary
Chapter 32: Creating Advanced Maps
Using cartographic projections
Creating a rotating globe
Creating an interactive star map
Projecting raster images with D3
Summary
Chapter 33: Creating a Real-time Application
Collaborating in real time with Firebase
Creating a Twitter explorer application
Creating the streaming server
Creating the client application
Summary

Book Details

ISBN 139781787281776
Paperback868 pages
Read More

Read More Reviews

Recommended for You

Flask: Building Python Web Services Book Cover
Flask: Building Python Web Services
$ 79.99
$ 56.00
Python: Data Analytics and Visualization Book Cover
Python: Data Analytics and Visualization
$ 79.99
$ 56.00
D3.js 4.x Data Visualization - Third Edition Book Cover
D3.js 4.x Data Visualization - Third Edition
$ 31.99
$ 22.40
Learning d3.js Data Visualization - Second Edition Book Cover
Learning d3.js Data Visualization - Second Edition
$ 31.99
$ 22.40
Building Interactive Data Visualizations with D3.js [Video] Book Cover
Building Interactive Data Visualizations with D3.js [Video]
$ 84.99
$ 72.25
Building Responsive Data Visualizations with D3.js [Video] Book Cover
Building Responsive Data Visualizations with D3.js [Video]
$ 84.99
$ 72.25