- What is D3.js?
- Controlling HTML within selections
- Binding data to the DOM
- Drawing SVG graphics with D3
- Using ordinal scales
- Adding events and transitions
- Working with data
Skill Level Intermediate
- [Ray] Hey there, this is Ray Villalobos, senior staff author, and in this course, I'm going to introduce you to the basic components of the D3 framework. We'll do this by building a chart step-by-step. We'll start by understanding what D3 is and learn how to work with selecting and manipulating regular HTML DOM elements. Then, we'll do a quick introduction to SVG, so that you can understand how D3 creates elements using scalable vector graphics. Once we go through that, we'll break into the basics of scales which D3 uses to create streams of information.
There are many types of scales in D3 and we'll cover linear, ordinal, as well as time-base scales. We'll also learn how to add events so that our scales can respond to regular DOM events and how to animate our SVG graphics for a more dramatic effect. Finally, I'll show you how easy it is to import data with D3. We'll create a bar chart that tracks temperatures over a period of time. There's a lot to learn, but that's why you're here, so let's get started.