ShapePath

ShapePath class

Represents a creation path consisting of a series of moves, lines and curves that when combined will form a geometric shape.

class ShapePath;

Constructors

NameDescription
constructor()Initializes a new instance of the ShapePath class.

Properties

PropertyTypeDescription
pathSegementListShapeSegmentPathCollectionReadonly. Gets ShapeSegmentPathCollection list
widthPixelnumberGets the width of this path in unit of pixels.
heightPixelnumberGets the height of this path in unit of pixels.

Methods

MethodDescription
moveTo(number, number)Starts a new figure from the specified point without closing the current figure. All subsequent points added to the path are added to this new figure.Unit: Pixel.
lineTo(number, number)Appends a line segment to the current figure. The starting point is the end point of the current figure.Unit: Pixel.
cubicBezierTo(number, number, number, number, number, number)Appends a cubic Bézier curve to the current figure. The starting point is the end point of the current figure.Unit: Pixel.
arcTo(number, number, number, number)Appends an elliptical arc to the current figure. The starting point is the end point of the current figure.
close()Closes the current figure and starts a new figure. If the current figure contains a sequence of connected lines and curves, the method closes the loop by connecting a line from the endpoint to the starting point.

constructor()

Initializes a new instance of the ShapePath class.

constructor();

pathSegementList

Readonly. Gets ShapeSegmentPathCollection list

pathSegementList : ShapeSegmentPathCollection;

widthPixel

Gets the width of this path in unit of pixels.

widthPixel : number;

heightPixel

Gets the height of this path in unit of pixels.

heightPixel : number;

moveTo(number, number)

Starts a new figure from the specified point without closing the current figure. All subsequent points added to the path are added to this new figure.Unit: Pixel.

moveTo(x: number, y: number) : void;

Parameters:

ParameterTypeDescription
xnumberThe x-coordinate of the starting point of the figure(Unit: Pixel).
ynumberThe y-coordinate of the starting point of the figure(Unit: Pixel).

lineTo(number, number)

Appends a line segment to the current figure. The starting point is the end point of the current figure.Unit: Pixel.

lineTo(x: number, y: number) : void;

Parameters:

ParameterTypeDescription
xnumberThe x-coordinate of the endpoint of the line segment(Unit: Pixel).
ynumberThe y-coordinate of the endpoint of the line segment(Unit: Pixel).

cubicBezierTo(number, number, number, number, number, number)

Appends a cubic Bézier curve to the current figure. The starting point is the end point of the current figure.Unit: Pixel.

cubicBezierTo(ctrX1: number, ctrY1: number, ctrX2: number, ctrY2: number, endX: number, endY: number) : void;

Parameters:

ParameterTypeDescription
ctrX1numberThe x-coordinate of the first control point for the curve(Unit: Pixel).
ctrY1numberThe y-coordinate of the first control point for the curve(Unit: Pixel).
ctrX2numberThe x-coordinate of the second control point for the curve(Unit: Pixel).
ctrY2numberThe y-coordinate of the second control point for the curve(Unit: Pixel).
endXnumberThe x-coordinate of the endpoint of the curve(Unit: Pixel).
endYnumberThe y-coordinate of the endpoint of the curve(Unit: Pixel).

arcTo(number, number, number, number)

Appends an elliptical arc to the current figure. The starting point is the end point of the current figure.

arcTo(wR: number, hR: number, stAng: number, swAng: number) : void;

Parameters:

ParameterTypeDescription
wRnumberThe half-width of the rectangular area of ​​the ellipse that draws the arc(Unit: Pixel).
hRnumberThe half-height of the rectangular area of ​​the ellipse that draws the arc(Unit: Pixel).
stAngnumberThe starting angle of the arc, measured in degrees clockwise from the x-axis(Unit: Degree). This angle will specify what angle along the supposed circle path will be used as the start position for drawing the arc. This start angle will be locked to the last known pen position in the shape path. Thus guaranteeing a continuos shape path.
swAngnumberThe swing angle for an arc. This angle will specify how far angle-wise along the supposed cicle path the arc will be extended. The extension from the start angle will always be in the clockwise direction around the supposed circle.(Unit: Degree)

close()

Closes the current figure and starts a new figure. If the current figure contains a sequence of connected lines and curves, the method closes the loop by connecting a line from the endpoint to the starting point.

close() : void;