D3 Layout - Stack Layout
  Duration: 26:19
Part of Course: Intermediate D3 Course
This Lesson is for subscribers

D3-layout-stack-layout_280x158
Unlock this lesson NOW!
  • Get expert advice on D3 Layout - Stack Layout
  • Enjoy access to the complete DashingD3js catalog
  • Start mastering D3.js right now!

Takeaways:

  • D3 provides a variety of Layout helpers so you don't have to do complicate math or algorithmic computation
  • The D3 Layout - Stack Layout calculates, given a data set, the coordinates for each layer of the stack
  • To pass data into the D3 Layout Stack Layout, you have to pass in an array of arrays where each internal array represents a layer and every layer will have an array of objects that have the x and y key value pair defined for the x-position and y-thickness of the layer
  • Because you have to construct the data structure to pass into the D3 Layout Stack Layout, it's important to understand how to build nested data structures using .forEach, .map, and how to construct arrays of objects on the fly
  • When constructing the data structure to pass into the D3 Layout Stack Layout, it's important to keep data out of the keys of the key value pairs of the objects

This Transcript is for subscribers.

D3-layout-stack-layout_280x158
Unlock this D3 Tutorial NOW!
  • Get expert advice on D3 Layout - Stack Layout
  • Enjoy access to the complete DashingD3js catalog
  • Start mastering D3.js right now!
<< Back To D3 Screencast and Written Tutorials Index