AreaPath
extends Path
The AreaPath class represents an enclosed area mark that is used in visualizations such as the area chart and the violin plot. You cannot create an AreaPath object directly, instead, you need to use the densify method in the Scene class to transform a RectPath to an AreaPath. Here is an explanation of the densify operation. The figure below shows how AreaPath objects are created from a RectPath object through the densify operation.
Properties
property | explanation | type | default value |
---|---|---|---|
width | the width of the area | Number | |
height | the height of the area | Number | |
left | the x coordinate of the first vertex | Number | |
top | the y coordinate of the first vertex | Number | |
orientation | the orientation of the area | String | |
baseline | the anchor used to evenly distribute the width or height of the area | String | |
firstVertexPair | the first pair of the vertices (highlighted in red in the figure above) | Array of Vertex |
Properties inherited from Path
property | explanation | type | default value |
---|---|---|---|
bounds | the bounding rectangle of the path | Rectangle | |
x | the x coordinate of the center of the path bounds | Number | |
y | the y coordinate of the center of the path bounds | Number | |
curveMode | how the segments are drawn | String | |
vertices | the vertices along the path | Array | |
segments | the segments on the path | Array | |
firstVertex | returns the first vertex of the path | Vertex | |
firstSegment | returns the first segment of the path | Segment | |
fillColor | the fill color of the path if it is closed | Color | undefined |
strokeColor | the stroke color of the path | Color | “#ccc” |
strokeDash | the dashes and gaps for the path stroke | String | “none” |
strokeWidth | the stroke width of the path in pixels | Number | 1 |
opacity | the opacity value of the path (between 0 and 1) | Number | 1 |
vxShape | the shape of the vertices on this path possible values: “rect”, “circle” | String | undefined |
vxWidth | the width of the vertices on this path | Number | 0 |
vxHeight | the height of the vertices on this path | Number | 0 |
vxRadius | the radius of the vertices on this path if the shape is “circle” | Number | 0 |
vxFillColor | the fill color of the vertices on this path | Color | “#555” |
vxStrokeColor | the stroke color of the vertices on this path | Color | “#aaa” |
vxStrokeWidth | the stroke width of the vertices on this path in pixels | Number | 0 |
vxOpacity | the opacity of the vertices on this path | Number | 1 |
Properties inherited from Mark
property | explanation | type | default value |
---|---|---|---|
id | the unique id of the path | String | |
type | the type of the path | String | “area” |
dataScope | the data scope of the path | DataScope | undefined |
opacity | the opacity value of the path (between 0 and 1) | Number | 1 |
visibility | whether the path is visible (“visible” or “hidden”) | String | “visible” |
Methods inherited from Path
method | explanation | return type |
---|---|---|
getSVGPathData() | returns a string to be used as the d parameter in an SVG path element | String |
Methods inherited from Mark
method | explanation | return type |
---|---|---|
contains(x, y) | whether this mark contains a point x (Number): x coordinate of the point y (Number): y coordinate of the point | Boolean |
getScene() | returns the scene in which this mark resides | Scene |
duplicate() | returns a copy of this mark | RectPath |