Block-a-Day #3. A bar chart composed of treemaps.
Data Sources: Census
What I Learned: A ton about the new d3.hierarchy API. Creating this block led me to open a pull request on d3-hierarchy to add support for applying the treemap layout to child nodes of the hierarchy. The PR was rejected for the sake of API consistency across all of the hierarchy layouts (a promise to support child nodes might make some layout implementations more difficult). As a result, per the discussion on the PR, I’m using node.copy to create separate trees from each of the branches to which I need to apply the treemap layout. As these branches are then orphaned from the larger hierarchy, they must be separately maintained on each update. This is done within .each blocks on selections, an approach that I think is kind of a cool way to operate at a specific depth of a hierarchy and take advantage of the general update pattern, even though I generally try to separate data transformation and presentation.
What I’d Do With More Time: As a two-day block, there’s probably already too much polish applied, although it could use a legend. Part of the point here was to take d3.hierarchy out for a spin, but I’d be curious to try and contrast an alternative implementation that limits the use of hierarchies to the point at which they are required for the treemap.
Just what it sounds like. For fifteen days, I will make a D3.js v4 block every single day. Rules: