D3 4.x: Mastering Data Visualization

Hi there! If you’re proficient in HTML, CSS, and JavaScript, and want to figure out data visualization for the web, then you’ve come to the right place.

This course is a blend of text, videos, code examples, and assessments, which together makes your learning journey all the more exciting and truly rewarding. It includes sections that form a sequential flow of concepts covering a focused learning path presented in a modular manner. This helps you learn a range of topics at your own speed and also move towards your goal of mastering data visualization with D3.

D3.js is a JavaScript library designed to display digital data in dynamic graphical form. It helps you bring data to life using HTML, SVG, and CSS. D3 allows greater control over the final visual result, and it is the hottest and most powerful web-based data visualization technology in the market today.

This course has been prepared using extensive research and curation skills. Each section adds to the skills learned and helps us to achieve mastery in solving data visualization problems using D3. Every section is modular and can be used as a standalone resource too.

This course has been designed to teach you D3 through the use of practical recipes, a do-as-you-learn approach, to provide you with skills to develop your own cool, neat-looking visualizations.

This course starts with the basic D3 structure and building blocks and quickly moves on to writing idiomatic D3-style JavaScript code. We will learn how to work with selections to target certain visual elements on the page, then we will see techniques to represent data both in programming constructs and its visual metaphor. We will learn how to map values in our data domain to the visual domain using scales, and use the various shape functions supported by D3 to create SVG shapes in visualizations. Moving on, we’ll see how to use and customize various D3 axes and master transitions to add bells and whistles to otherwise dry visualizations. We’ll also learn to work with charts, hierarchy, graphs, and build interactive visualizations. Next we’ll work with force, which is one of the most awe-inspiring techniques we can add to our visualizations. We'll then see how to create a basic Angular 2 application complete with components, services, data and event binding, and a testing infrastructure. We will learn how to integrate D3 into an Angular 2 application. We will build a data dashboard out of flexible Angular 2 components. Finally, we will learn to leverage a few advanced features and functionalities such as incorporating real-time data streams, and adding interactivity and animations.

This course will take you through the most common to the not-so-common techniques to build data visualizations using D3.

This course has been authored by some of the best in their fields:

Nick Zhu

Nick Zhu is a professional programmer and data engineer with more than a decade experience in software development, Big Data, and machine learning. Currently, he is one of the founders and CTO of Yroo - a meta search engine for online shopping. He is also the creator of dc.js — a popular multidimensional charting library built on D3.

Matt Dionis

Matt Dionis has over three years of experience with both Angular and D3.js. He uses D3.js frequently and Angular on a daily basis while building internal tools for a rapidly growing financial technology start-up.