Class pv.Layout.Treemap
Extends
pv.Layout.Hierarchy.
Implements a space-filling rectangular layout, with the hierarchy
represented via containment. Treemaps represent nodes as boxes, with child
nodes placed within parent boxes. The size of each box is proportional to the
size of the node in the tree. This particular algorithm is taken from Bruls,
D.M., C. Huizing, and J.J. van Wijk, "Squarified Treemaps" in
Data Visualization 2000, Proceedings of the Joint Eurographics and IEEE
TCVG Sumposium on Visualization, 2000, pp. 33-42.
The meaning of the exported mark prototypes changes slightly in the space-filling implementation:
- node - for rendering nodes; typically a pv.Bar. The node data is populated with dx and dy attributes, in addition to the standard x and y position attributes.
- leaf - for rendering leaf nodes only, with no fill or stroke style by default; typically a pv.Panel or another layout!
- link - unsupported; undefined. Links are encoded implicitly in the arrangement of the space-filling nodes.
- label - for rendering node labels; typically a pv.Label.
Defined in: Treemap.js.
Constructor Attributes | Constructor Name and Description |
---|---|
Constructs a new, empty treemap layout.
|
Field Attributes | Field Name and Description |
---|---|
Default propertiess for treemap layouts.
|
|
The treemap algorithm.
|
|
The sibling node order.
|
|
The bottom inset between parent and child in pixels.
|
|
The left inset between parent add child in pixels.
|
|
The right inset between parent add child in pixels.
|
|
The top inset between parent and child in pixels.
|
|
Whether node sizes should be rounded to integer values.
|
- Fields borrowed from class pv.Layout.Network:
- label, link, node
- Fields borrowed from class pv.Panel:
- canvas, children, overflow, transform
- Fields borrowed from class pv.Bar:
- fillStyle, height, lineWidth, strokeStyle, width
- Fields borrowed from class pv.Mark:
- bottom, childIndex, cursor, data, events, index, left, parent, proto, reverse, right, root, scale, title, top, type, visible
Method Attributes | Method Name and Description |
---|---|
padding(n)
Alias for setting the left, right, top and bottom padding properties
simultaneously.
|
|
size(f)
Specifies the sizing function.
|
- Methods borrowed from class pv.Layout.Network:
- reset
- Methods borrowed from class pv.Panel:
- add, anchor
- Methods borrowed from class pv.Mark:
- anchorTarget, def, event, extend, margin, mouse, render
- See:
- "Ordered Treemap Layouts" by B. Shneiderman & M. Wattenberg, IEEE InfoVis 2001.
- See:
- #padding
- See:
- #padding
- See:
- #padding
- See:
- #padding
- Parameters:
- n
- Returns:
- {pv.Layout.Treemap} this.
The sizing function is invoked for each leaf node in the tree, per the nodes property. For example, if the tree data structure represents a file system, with files as leaf nodes, and each file has a bytes attribute, you can specify a size function as:
.size(function(d) d.bytes)
- Parameters:
- {function} f
- the new sizing function.
- Returns:
- {pv.Layout.Treemap} this.