This video explains how to use the nest function.
- [Instructor] D3 has a number of functions…for manipulating data.…We've already seen map which runs a transformation…on each row of a data set.…Now we're going to look at nest.…Nest turns flat tabular data into hierarchical data.…Change the reference in d3.html to dataHandlers…and reopen that file…and find the section that's got the C-S-V data handler…which for me is at the top.…If we just log this data to the console,…let's see what we actually start with…by way of data.…
And we see that we have an array of objects.…We've got one object for each row.…Each object contains a month which is a date and price.…So go back to atom and declare…a new variable called nested data.…And we set it to d3.nest…and we give it two parameters: .key and .entries…which you can style any way you like.…I'm going to style mine like that.…Entries is the array containing the data we want to nest…and in our case that's called data…because that's the name we've given it here…in these brackets, so we just type in data there.…
Key tells D3 how we want to group the data.…
- 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
Data Visualization for Data Analystswith Bill Shander1h 31m Beginner
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?
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.