Class pv.Bar
Extends
pv.Mark.
Represents a bar: an axis-aligned rectangle that can be stroked and
filled. Bars are used for many chart types, including bar charts, histograms
and Gantt charts. Bars can also be used as decorations, for example to draw a
frame border around a panel; in fact, a panel is a special type (a subclass)
of bar.
Bars can be positioned in several ways. Most commonly, one of the four corners is fixed using two margins, and then the width and height properties determine the extent of the bar relative to this fixed location. For example, using the bottom and left properties fixes the bottom-left corner; the width then extends to the right, while the height extends to the top. As an alternative to the four corners, a bar can be positioned exclusively using margins; this is convenient as an inset from the containing panel, for example. See pv.Mark for details on the prioritization of redundant positioning properties.
See also the Bar guide.
Defined in: Bar.js.
Constructor Attributes | Constructor Name and Description |
---|---|
pv.Bar()
Constructs a new bar mark with default properties.
|
Field Attributes | Field Name and Description |
---|---|
Default properties for bars.
|
|
The bar fill style; if non-null, the interior of the bar is filled with the
specified color.
|
|
The height of the bar, in pixels.
|
|
The width of stroked lines, in pixels; used in conjunction with
strokeStyle to stroke the bar's border.
|
|
The style of stroked lines; used in conjunction with lineWidth to
stroke the bar's border.
|
|
The width of the bar, in pixels.
|
- Fields borrowed from class pv.Mark:
- bottom, childIndex, cursor, data, index, left, parent, proto, reverse, right, root, scene, title, top, type, visible
Method Attributes | Method Name and Description |
---|---|
anchor(name)
Constructs a new bar anchor with default properties.
|
- Methods borrowed from class pv.Mark:
- add, anchorTarget, cousin, def, event, extend, first, last, mouse, render, sibling
- See:
- pv.color
- See:
- pv.color
- top
- left
- center
- bottom
- right
To facilitate stacking of bars, the anchors are defined in terms of their opposite edge. For example, the top anchor defines the bottom property, such that the bar grows upwards; the bottom anchor instead defines the top property, such that the bar grows downwards. Of course, in general it is more robust to use panels and the cousin accessor to define stacked bars; see pv.Mark#scene for an example.
Bar anchors also "smartly" specify position properties based on whether the derived mark type supports the width and height properties. If the derived mark type does not support these properties (e.g., dots), the position will be centered on the corresponding edge. Otherwise (e.g., bars), the position will be in the opposite side.
- Parameters:
- {string} name
- the anchor name; either a string or a property function.
- Returns:
- {pv.Anchor}