We are now going to get into what some refer to as the most powerful features of D3.js —layouts. Layouts encapsulate algorithms that examine your data and calculate the positions for visual elements for specific type of graphs such as bars, areas, bubbles, chords, trees, and many others.
We will dive into several useful layouts. These will be categorized into several main categories based upon the structure of the data and type of visualization such as stacked, hierarchical, chords, and flow-based diagrams. For each of the categories, we will go over creating a number of examples, complete with data and code.
Specifically, we will examine creating the following types of graphs and layouts:
Stacked layouts to create bar and area graphs
Hierarchical diagrams including trees, cluster dendrograms, and enclosures
Relationships between items using chord diagrams
Flowing data using streamgraphs and Sankey diagrams