Class pv.Layout.Pack
Extends
pv.Layout.Hierarchy.
Implements a hierarchical layout using circle-packing. The meaning of
the exported mark prototypes changes slightly in the space-filling
implementation:
- node - for rendering nodes; typically a pv.Dot.
- link - unsupported; undefined. Links are encoded implicitly in the arrangement of the space-filling nodes.
- label - for rendering node labels; typically a pv.Label.
The size function can be used in conjunction with the order property, which allows the nodes to the sorted by the computed size. Note: for sorting based on other data attributes, simply use the default null for the order property, and sort the nodes beforehand using the pv.Dom operator.
For more details on how to use this layout, see
pv.Layout.Hierarchy.
Defined in: Pack.js.
Constructor Attributes | Constructor Name and Description |
---|---|
Constructs a new, empty circle-packing layout.
|
Field Attributes | Field Name and Description |
---|---|
Default properties for circle-packing layouts.
|
|
The sibling node order.
|
|
The spacing parameter; defaults to 1, which provides a little bit of padding
between sibling nodes and the enclosing circle.
|
- 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 |
---|---|
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:
- "Visualization of large hierarchical data by circle packing" by W. Wang, H. Wang, G. Dai, and H. Wang, ACM CHI 2006.
- See:
- pv.Dom.Node#sort
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)As with other properties, a size function may specify additional arguments to access the data associated with the layout and any enclosing panels.
- Parameters:
- {function} f
- the new sizing function.
- Returns:
- {pv.Layout.Pack} this.