Class pv.Area
Extends pv.Mark.
Represents an area mark: the solid area between two series of connected line segments. Unsurprisingly, areas are used most frequently for area charts.
Just as a line represents a polyline, the Area mark type represents a polygon. However, an area is not an arbitrary polygon; vertices are paired either horizontally or vertically into parallel spans, and each span corresponds to an associated datum. Either the width or the height must be specified, but not both; this determines whether the area is horizontally-oriented or vertically-oriented. Like lines, areas can be stroked and filled with arbitrary colors.
See also the Area guide.
Defined in: Area.js.
Constructor Attributes | Constructor Name and Description |
---|---|
pv.Area()
Constructs a new area mark with default properties.
|
Field Attributes | Field Name and Description |
---|---|
Default properties for areas.
|
|
The area fill style; if non-null, the interior of the polygon forming the
area is filled with the specified color.
|
|
The height of a given span, in pixels; used for vertical spans.
|
|
How to interpolate between values.
|
|
The width of stroked lines, in pixels; used in conjunction with
strokeStyle to stroke the perimeter of the area.
|
|
Whether the area is segmented; whether variations in fill style, stroke
style, and the other properties are treated as fixed.
|
|
The style of stroked lines; used in conjunction with lineWidth to
stroke the perimeter of the area.
|
|
The width of a given span, in pixels; used for horizontal spans.
|
- 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 area anchor with default properties.
|
- Methods borrowed from class pv.Mark:
- add, anchorTarget, cousin, def, event, extend, first, last, mouse, render, sibling
Constructs a new area mark with default properties. Areas are not typically constructed directly, but by adding to a panel or an existing mark via pv.Mark#add.
Default properties for areas. By default, there is no stroke and the fill style is a categorical color.
The area fill style; if non-null, the interior of the polygon forming the area is filled with the specified color. The default value of this property is a categorical color.
This property is fixed for non-segmented areas. See pv.Mark.
- See:
- pv.color
The height of a given span, in pixels; used for vertical spans. If the height is specified, the width property should be 0 (the default). Either the left or right property should be used to space the spans horizontally, typically as a multiple of the index.
How to interpolate between values. Linear interpolation ("linear") is the default, producing a straight line between points. For piecewise constant functions (i.e., step functions), either "step-before" or "step-after" can be specified.
Note: this property is currently supported only on non-segmented areas.
This property is fixed. See pv.Mark.
The width of stroked lines, in pixels; used in conjunction with strokeStyle to stroke the perimeter of the area. Unlike the Line mark type, the entire perimeter is stroked, rather than just one edge. The default value of this property is 1.5, but since the default stroke style is null, area marks are not stroked by default.
This property is fixed for non-segmented areas. See pv.Mark.
Whether the area is segmented; whether variations in fill style, stroke style, and the other properties are treated as fixed. Rendering segmented areas is noticeably slower than non-segmented areas.
This property is fixed. See pv.Mark.
The style of stroked lines; used in conjunction with lineWidth to stroke the perimeter of the area. Unlike the Line mark type, the entire perimeter is stroked, rather than just one edge. The default value of this property is null, meaning areas are not stroked by default.
This property is fixed for non-segmented areas. See pv.Mark.
- See:
- pv.color
The width of a given span, in pixels; used for horizontal spans. If the width is specified, the height property should be 0 (the default). Either the top or bottom property should be used to space the spans vertically, typically as a multiple of the index.
Constructs a new area anchor with default properties. Areas support five different anchors:
- top
- left
- center
- bottom
- right
To facilitate stacking of areas, the anchors are defined in terms of their opposite edge. For example, the top anchor defines the bottom property, such that the area grows upwards; the bottom anchor instead defines the top property, such that the area grows downwards. Of course, in general it is more robust to use panels and the cousin accessor to define stacked area marks; see pv.Mark#scene for an example.
- Parameters:
- {string} name
- the anchor name; either a string or a property function.
- Returns:
- {pv.Anchor}