Data Visualize Data With D3.Js The Easy Way

Learn how to use D3.js to create data driven graphics and documents. A beginners guide to getting started with D3

What you'll learn
Learn how to use D3 to visualise data
A easy to follow course that teaches you how to use D3 to create dynamic and interactive graphics from data driven input
Requirements
PC or Mac
Description
This Learning to Visualize Data with D3.js training course from Infinite Skills teaches you how to build data visualizations with the D3 JavaScript library. This course is designed for users that already have some HTML, CSS, and JavaScript programming experience. You will start by learning the basics of D3, including how to bind data from JavaScript arrays to elements, scale data, and style simple data visualizations with CSS. From there, This course will show you how to introduce interactivity into your data visualization, including how to add a sort button, animate changes, and respond to other mouse events. This video tutorial will also cover how to create a line chart and a scatter-plot data visualization. Once you have completed this computer based training course, you will have developed a solid working knowledge of D3, and be able to build your own data visualizations. Working files are included, allowing you to follow along with the author throughout the lessons.

Overview

Section 1: Introduction

Lecture 1 Important - Download These First - Working Files

Lecture 2 Introduction To Data Visualization With D3

Lecture 3 What You Will Need

Lecture 4 Setting Up Your Development Environment

Lecture 5 Using The Project Template

Lecture 6 Reading The D3 Documentation

Lecture 7 How To Access Your Working Files

Section 2: Javascript Essentials

Lecture 8 Reviewing Arrays And Objects

Lecture 9 Using The Map And Filter Array Methods

Lecture 10 Using Special D3 Array Functions

Section 3: Creating A Simple Bar Chart

Lecture 11 Creating The SVG Element Programatically

Lecture 12 Creating Bars From Data

Lecture 13 Scaling Data

Lecture 14 Styling The Bars With CSS

Lecture 15 Adding Text To The Chart

Lecture 16 Adding Flexibility With A Chart Function

Lecture 17 Using SVG Groups

Section 4: Creating A Complex Bar Chart

Lecture 18 Working With Arrays Of Objects

Lecture 19 Creating An Ordinal Scale

Lecture 20 Setting Color With Color Scales

Lecture 21 Adding X And Y Axes

Lecture 22 Flipping The Axes

Lecture 23 Adding Gridlines

Lecture 24 Rotating The X Axis Text

Lecture 25 Adding Axis Labels

Lecture 26 Updating The Plot Function With Best Practices

Section 5: Making The Chart Interactive

Lecture 27 Adding A Sort Button To The Webpage

Lecture 28 Sorting Data

Lecture 29 Updating The Chart With Changes In Data

Lecture 30 Updating The Axes With Changes In Data

Lecture 31 Animating Changes In Data

Lecture 32 Responding To Other Mouse Events

Section 6: Creating A Line Chart

Lecture 33 Working With Dates

Lecture 34 Plotting Time Data

Lecture 35 Formatting A Time Scale Axis

Lecture 36 Drawing A Path

Lecture 37 Shading An Area Of The Chart

Lecture 38 Exploring Path Options And Styling

Section 7: Creating A Scatter-Plot

Lecture 39 Scatterplot Overview

Lecture 40 Examining The Data

Lecture 41 Plotting The Data

Lecture 42 Creatively Scaling The Data Points

Lecture 43 Plotting Groups Of Data Points

Lecture 44 Adding The Y Axis And Gridlines

Lecture 45 Adding The X Axis And Gridlines

Lecture 46 Styling The Data Categories

Lecture 47 Adding Interactivity - Data Detail

Lecture 48 Adding Interactivity - Chart Key And Labels

Lecture 49 Loading External CSV Data

Section 8: Conclusion

Lecture 50 0801 Wrap Up

Users how have a basic understanding of HTML and CSS