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.

Class Summary
Constructor Attributes	Constructor Name and Description
	pv.Bar() Constructs a new bar mark with default properties.

Field Summary
Field Attributes	Field Name and Description
	defaults Default properties for bars.
	fillStyle The bar fill style; if non-null, the interior of the bar is filled with the specified color.
	height The height of the bar, in pixels.
	lineWidth The width of stroked lines, in pixels; used in conjunction with `strokeStyle` to stroke the bar's border.
	strokeStyle The style of stroked lines; used in conjunction with `lineWidth` to stroke the bar's border.
	width 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 Summary
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

Class Detail

pv.Bar()

Constructs a new bar mark with default properties. Bars are not typically constructed directly, but by adding to a panel or an existing mark via pv.Mark#add.

Field Detail

{pv.Bar} defaults

Default properties for bars. By default, there is no stroke and the fill style is a categorical color.

{string} fillStyle

The bar fill style; if non-null, the interior of the bar is filled with the specified color. The default value of this property is a categorical color.

See:: pv.color

{number} height

The height of the bar, in pixels. If the bottom position is specified, the bar extends upward from the bottom edge; if the top position is specified, the bar extends downward from the top edge.

{number} lineWidth

The width of stroked lines, in pixels; used in conjunction with strokeStyle to stroke the bar's border.

{string} strokeStyle

The style of stroked lines; used in conjunction with lineWidth to stroke the bar's border. The default value of this property is null, meaning bars are not stroked by default.

See:: pv.color

{number} width

The width of the bar, in pixels. If the left position is specified, the bar extends rightward from the left edge; if the right position is specified, the bar extends leftward from the right edge.

Method Detail

{pv.Anchor} anchor(name)

Constructs a new bar anchor with default properties. Bars support five different anchors:

top
left
center
bottom
right

In addition to positioning properties (left, right, top bottom), the anchors support text rendering properties (text-align, text-baseline). Text is rendered to appear inside the bar.

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}

Classes

Class pv.Bar