This video explains how path is the vehicle to all complex graphics.
- [Narrator] Path is a big deal in D3.…A path is a line, essentially.…It can be wiggly, or straight, and it can be open,…such as in a line chart, or closed, as in an area chart.…Paths can be filled, and they can make…unusual, irregular shapes.…Paths are crucial for making advanced graphics in D3.…In this chapter, we're going to learn how to use path…to add a shape that serves as an area chart,…albeit one without axes.…To create a path, we need to use something called…a generator, so we'll take a look at those too.…
And I'll introduce you to groups,…which are fundamental to making advanced graphics in D3.…In chapter three, we looked at SVG shapes,…which each have a set of mandatory attributes.…For line, they were X1, Y1, and X2, Y2.…Paths work differently.…A path might contain 2000 points,…so we can list them all out as attributes.…Path takes one single attribute, D, or data.…The data have to be presented in a particular way,…as a string of x,y coordinates, separated by spaces.…
The first letter here, M, means move to.…
- Making a simple bar chart with D3
- Understanding SVG graphics
- Drawing basic shapes
- Adding text
- Using generators and the path element
- Creating a scale and axes
- Importing data into D3
- Creating trees and Voronoi tessellations
- Preparing your data for advanced graphics
- Adding interactivity and transitions
- Choosing the right graphic
- Finding D3.js plugins
Skill Level Intermediate
2. Making a Simple Bar Chart with D3
3. Basic Shapes, Courtesy of SVG
4. Advanced Shapes, with D3 and Path
5. Scales and Axes
6. Importing Data into D3
7. Additional Graphics with D3 Layout
8. Preparing Your Data for Advanced Graphics
10. Picking the Right Graphic
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.