Returns an object that contains all the methods that can be used for operations that require mathematical calculations.
Properties
.getTValue
Get t Value for segments based on a point on segment.
Examples:
var pathlist = [{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}],
point;
t_value = Vecta.math.getTValue(pathlist, {x: 5, y: 5}); //Get the t value on pathList
console.log(t_value) //0.5
Methods
.angle(x, y, cx, cy) Returns: number
Calculate the angle of given a point from a center point.
| Name | Type | Description |
|---|---|---|
x | number | X coordinate |
y | number | Y coordinate |
cx | number | X coordinate of the center point |
cy | number | Y coordinate of the center point |
Returns:
Returns the angle in degrees.
Examples:
var point = {x: 20, y:20},
cx = 10,
cy = 10,
angle;
angle = Vecta.math.angle(point.x, point.y, cx, cy); //get the degree of (20, 20) from center (10, 10)
console.log(angle); //135.distance(x1, y1, x2, y2) Returns: number
Calculate the distance between 2 points
| Name | Type | Description |
|---|---|---|
x1 | number | The x coordinate of the first point |
y1 | number | The y coordinate of the first point |
x2 | number | The x coordinate of the second point |
y2 | number | The y coordinate of the second point |
Returns:
Returns the distance between the two coordinates.
Examples:
var distance = Vecta.math.distance(10, 20, 50, 40);
console.log(distance); //44.721359549995796.getPoint(list, t) Returns: Point
Get a point on a segment based on t value.
| Name | Type | Description |
|---|---|---|
list | PathList | The path segment list to get a point from |
t | number | The T value |
Returns:
Returns the resulting point.
Examples:
var pathlist = [{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}],
point;
point = Vecta.math.getPoint(pathlist, 0.5); //Get the point on pathList with a T value of 0.5
console.log(points) //{x: 5, y: 5}.intersect(s1, s2) Returns: Intersect
Determines if 2 segments intersect.
| Name | Type | Description |
|---|---|---|
s1 | PathList[] | Segment array in the form |
s2 | PathList[] | Segment array in the form |
Returns:
Returns an intersection object.
Examples:
var path_1 = [{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}],
path_2 = [{type: 'M', x: 20, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 0, y: 20}],
intersect;
intersect = Vecta.math.intersect(path_1, path_2);
console.log(intersect); //{pts: [{x: 10, y: 10}], [[1], [1]]}.isPointInShape(x, y, shape) Returns: boolean
Check if a point is inside a shape. The left top is the coordinate origin.
| Name | Type | Description |
|---|---|---|
x | number | The x coordinate of the point |
y | number | The y coordinate of the point |
shape | Vecta.Shape | The shape to check |
Returns:
Returns true if point is inside path, false otherwise.
Examples:
Vecta.math.isPointInShape(10, 20, shape); //Checks whether the point (10, 20) is in the shape.isPointOnPath(x, y, list, [tolerance]) Returns: boolean
Check if a point is on top of a path.
| Name | Type | Attributes | Description |
|---|---|---|---|
x | number | The x coordinate to check. | |
y | number | The y coordinate to check. | |
list | PathList[] | The path segment list to check. | |
tolerance | number | optional | Tolerance to accept the point is on the path, default to 0.01px |
Returns:
Returns true if point is on top of the path, false otherwise.
Examples:
var pathlist = [{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}],
point = {x: 20, y:20},
pointOnPath;
//determine whether the point is in the path
pointOnPath = Vecta.math.isPointOnPath(point.x, point.y, pathlist);
console.log(pointOnPath); //true.normalizeAngle(angle) Returns: number
Normalize angle to within 0 - 360 degrees.
| Name | Type | Description |
|---|---|---|
angle | number | The angle to normalize |
Returns:
Returns the normalized angle in degrees.
Examples:
var normalizedAngle;
//normalize the angle 450 degrees to within 0 - 360 degrees
normalizedAngle = Vecta.math.normalizedAngle(450);
console.log(normalizedAngle); //90.offsetPathList(list, x, y) Returns: PathList[]
Offset a path.
| Name | Type | Description |
|---|---|---|
list | PathList[] | The path segment list to offset |
x | number | The x offset |
y | number | The y offset |
Returns:
Returns the changed path segment list.
Examples:
var pathlist = [{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}];
//offset the pathlist by x = 10 and y = 10
Vecta.math.offsetPathList(pathlist, 10, 10);.pointInPath(x, y, list) Returns: boolean
Check if a point is inside a path.
| Name | Type | Description |
|---|---|---|
x | number | The x coordinate to check |
y | number | The y coordinate to check |
list | PathList[] | The path segment list to check |
Returns:
Returns true if point is inside path, false otherwise.
Examples:
var pathlist = [{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}],
point = {x: 20, y:20},
pointInPath;
//determine whether the point is in the path
pointInPath = Vecta.math.pointInPath(point.x, point.y, pathlist);
console.log(pointInPath); //true.rotatePathList(list, cx, cy, angle) Returns: PathList[]
Rotate a list of segments.
| Name | Type | Description |
|---|---|---|
list | PathList[] | The path segment list to rotate |
cx | number | The x coordinate of center of rotation |
cy | number | The y coordinate of center of rotation |
angle | number | The angle to rotate in degrees |
Returns:
Returns the rotated list.
Examples:
var pathlist = [{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}];
//rotate the pathlist with the center (10, 10) at 90 degree angle
Vecta.math.rotatePathList(pathlist, 10, 10, 90);.rotatePoint(x, y, cx, cy, angle) Returns: Point
Rotate a point at a given angle and center.
The left top is the coordinate origin, and angles are always clockwise.
| Name | Type | Description |
|---|---|---|
x | number | The x coordinate of point to be rotation |
y | number | The y coordinate of point to be rotation |
cx | number | The center x coordinate of the rotation |
cy | number | The center y coordinate of the rotation |
angle | number | The angle that should be rotated |
Returns:
Returns the resulting point after rotation.
Examples:
//rotate a point starting at coordinate (10, 20) with the center (15, 15) at a 90 degree angle
var point = Vecta.math.rotatePoint(10, 20, 15, 15, 90);
console.log(point); //{x: 10, y: 10}.segmentize(list) Returns: PathList[][]
Split a path segment list into individual segments.
Although a path segment list contains a list of segments, most times, these segments may refer to the previous segment as a starting point for the next segment. For example:
[{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}]
The segmentize method split all these segments into individual segment preceded by a 'M' type, as below:
[[{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}], [{type: 'M', x: 10, y: 10}, {type: 'L', x: 20, y: 20}]]
| Name | Type | Description |
|---|---|---|
list | PathList[] | The path segment list to split |
Returns:
Returns an array of path segment list array, essentially a 2 dimensional array.
Examples:
var pathlist = [{type: 'M', x: 0, y: 0}, {type: 'L', x: 10, y: 10}, {type: 'L', x: 20, y: 20}];
Vecta.math.segmentize(pathlist); //split a path segment list into individual segments.splitSegment(seg, t) Returns: PathList[][]
Split path segments using a T value. Can split both line, quad and cubic curves.
| Name | Type | Description |
|---|---|---|
seg | PathList[] | The path segment list to split |
t | number | The T value to split |
Returns:
Returns an array containing split path segment list.
Examples:
var curve = [{type: "M", x: 0, y: 175}, {type: "Q", x1: 0, y1: 0, x: 135, y: 0}],
split;
split = Vecta.math.splitSegment(curve, 1/3); //Split the curve seg by a T value of 1/3
console.log(split); //an array of split path list.typeToList(type, x, y, width, height, rounded) Returns: PathList[][]
Convert a given type of SVG shape into an array of path segment lists.
| Name | Type | Description |
|---|---|---|
type | string | The type to be converted into an array of path segment lists. The type must be a string limited to the below:
|
x | number | The x coordinate of the type |
y | number | The y coordinate of the type |
width | number | The width of the type |
height | number | The height of the type |
rounded | number | The rounded corner value of the type |
Returns:
Returns an array of path segment list array, essentially a 2 dimensional array.
Examples:
//Convert a rectangle with width 50px, height 50px, and rounded corner radius 2px at coordinate (10, 20) to an array of path segment list
Vecta.math.typeToList('rect', 10, 20, 50, 30, 2);