modern-path2d 0.1.7 → 0.1.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +319 -278
- package/dist/index.d.cts +143 -135
- package/dist/index.d.mts +143 -135
- package/dist/index.d.ts +143 -135
- package/dist/index.js +1 -1
- package/dist/index.mjs +319 -278
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1,37 +1,37 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
class
|
|
3
|
+
class Vector2 {
|
|
4
4
|
constructor(x = 0, y = 0) {
|
|
5
5
|
this.x = x;
|
|
6
6
|
this.y = y;
|
|
7
7
|
}
|
|
8
8
|
static get MAX() {
|
|
9
|
-
return new
|
|
9
|
+
return new Vector2(Infinity, Infinity);
|
|
10
10
|
}
|
|
11
11
|
static get MIN() {
|
|
12
|
-
return new
|
|
12
|
+
return new Vector2(-Infinity, -Infinity);
|
|
13
13
|
}
|
|
14
14
|
set(x, y) {
|
|
15
15
|
this.x = x;
|
|
16
16
|
this.y = y;
|
|
17
17
|
return this;
|
|
18
18
|
}
|
|
19
|
-
add(
|
|
20
|
-
this.x +=
|
|
21
|
-
this.y +=
|
|
19
|
+
add(vec) {
|
|
20
|
+
this.x += vec.x;
|
|
21
|
+
this.y += vec.y;
|
|
22
22
|
return this;
|
|
23
23
|
}
|
|
24
|
-
sub(
|
|
25
|
-
this.x -=
|
|
26
|
-
this.y -=
|
|
24
|
+
sub(vec) {
|
|
25
|
+
this.x -= vec.x;
|
|
26
|
+
this.y -= vec.y;
|
|
27
27
|
return this;
|
|
28
28
|
}
|
|
29
|
-
distanceTo(
|
|
30
|
-
return Math.sqrt(this.distanceToSquared(
|
|
29
|
+
distanceTo(vec) {
|
|
30
|
+
return Math.sqrt(this.distanceToSquared(vec));
|
|
31
31
|
}
|
|
32
|
-
distanceToSquared(
|
|
33
|
-
const dx = this.x -
|
|
34
|
-
const dy = this.y -
|
|
32
|
+
distanceToSquared(vec) {
|
|
33
|
+
const dx = this.x - vec.x;
|
|
34
|
+
const dy = this.y - vec.y;
|
|
35
35
|
return dx * dx + dy * dy;
|
|
36
36
|
}
|
|
37
37
|
length() {
|
|
@@ -58,8 +58,8 @@ class Point2D {
|
|
|
58
58
|
this.y = v1.y + (v2.y - v1.y) * alpha;
|
|
59
59
|
return this;
|
|
60
60
|
}
|
|
61
|
-
equals(
|
|
62
|
-
return this.x ===
|
|
61
|
+
equals(vec) {
|
|
62
|
+
return this.x === vec.x && this.y === vec.y;
|
|
63
63
|
}
|
|
64
64
|
applyMatrix3(m) {
|
|
65
65
|
const x = this.x;
|
|
@@ -69,13 +69,13 @@ class Point2D {
|
|
|
69
69
|
this.y = e[1] * x + e[4] * y + e[7];
|
|
70
70
|
return this;
|
|
71
71
|
}
|
|
72
|
-
copy(
|
|
73
|
-
this.x =
|
|
74
|
-
this.y =
|
|
72
|
+
copy(vec) {
|
|
73
|
+
this.x = vec.x;
|
|
74
|
+
this.y = vec.y;
|
|
75
75
|
return this;
|
|
76
76
|
}
|
|
77
77
|
clone() {
|
|
78
|
-
return new
|
|
78
|
+
return new Vector2(this.x, this.y);
|
|
79
79
|
}
|
|
80
80
|
}
|
|
81
81
|
|
|
@@ -129,7 +129,7 @@ class BoundingBox {
|
|
|
129
129
|
return this;
|
|
130
130
|
}
|
|
131
131
|
getCenterPoint() {
|
|
132
|
-
return new
|
|
132
|
+
return new Vector2((this.left + this.right) / 2, (this.top + this.bottom) / 2);
|
|
133
133
|
}
|
|
134
134
|
clone() {
|
|
135
135
|
return new BoundingBox(this.left, this.top, this.width, this.height);
|
|
@@ -391,9 +391,9 @@ function getReflection(a, b) {
|
|
|
391
391
|
return a - (b - a);
|
|
392
392
|
}
|
|
393
393
|
function addPathCommandsToPath2D(commands, path) {
|
|
394
|
-
const point = new
|
|
395
|
-
const control = new
|
|
396
|
-
const firstPoint = new
|
|
394
|
+
const point = new Vector2();
|
|
395
|
+
const control = new Vector2();
|
|
396
|
+
const firstPoint = new Vector2();
|
|
397
397
|
let isFirstPoint = true;
|
|
398
398
|
let doSetFirstPoint = false;
|
|
399
399
|
for (let i = 0, l = commands.length; i < l; i++) {
|
|
@@ -920,7 +920,7 @@ class Curve {
|
|
|
920
920
|
__publicField$5(this, "_cacheArcLengths");
|
|
921
921
|
__publicField$5(this, "_needsUpdate", false);
|
|
922
922
|
}
|
|
923
|
-
getPointAt(u, output = new
|
|
923
|
+
getPointAt(u, output = new Vector2()) {
|
|
924
924
|
return this.getPoint(this.getUtoTmapping(u), output);
|
|
925
925
|
}
|
|
926
926
|
getPoints(divisions = 5) {
|
|
@@ -999,30 +999,28 @@ class Curve {
|
|
|
999
999
|
const segmentFraction = (targetArcLength - lengthBefore) / segmentLength;
|
|
1000
1000
|
return (i + segmentFraction) / (il - 1);
|
|
1001
1001
|
}
|
|
1002
|
-
getTangent(t, output = new
|
|
1002
|
+
getTangent(t, output = new Vector2()) {
|
|
1003
1003
|
const delta = 1e-4;
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
t2 = 1;
|
|
1010
|
-
return output.copy(this.getPoint(t2)).sub(this.getPoint(t1)).normalize();
|
|
1011
|
-
}
|
|
1012
|
-
getTangentAt(u, output = new Point2D()) {
|
|
1004
|
+
const t1 = Math.max(0, t - delta);
|
|
1005
|
+
const t2 = Math.min(1, t + delta);
|
|
1006
|
+
return output.copy(this.getPoint(t2).sub(this.getPoint(t1)).normalize());
|
|
1007
|
+
}
|
|
1008
|
+
getTangentAt(u, output) {
|
|
1013
1009
|
return this.getTangent(this.getUtoTmapping(u), output);
|
|
1014
1010
|
}
|
|
1015
1011
|
/** overrideable */
|
|
1016
1012
|
// eslint-disable-next-line unused-imports/no-unused-vars
|
|
1013
|
+
transformPoint(cb) {
|
|
1014
|
+
return this;
|
|
1015
|
+
}
|
|
1017
1016
|
transform(matrix) {
|
|
1017
|
+
this.transformPoint((point) => point.applyMatrix3(matrix));
|
|
1018
1018
|
return this;
|
|
1019
1019
|
}
|
|
1020
|
-
/** overrideable */
|
|
1021
1020
|
getDivisions(divisions) {
|
|
1022
1021
|
return divisions;
|
|
1023
1022
|
}
|
|
1024
|
-
|
|
1025
|
-
getMinMax(min = Point2D.MAX, max = Point2D.MIN) {
|
|
1023
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1026
1024
|
this.getPoints().forEach((point) => {
|
|
1027
1025
|
min.x = Math.min(min.x, point.x);
|
|
1028
1026
|
min.y = Math.min(min.y, point.y);
|
|
@@ -1035,9 +1033,14 @@ class Curve {
|
|
|
1035
1033
|
const { min, max } = this.getMinMax();
|
|
1036
1034
|
return new BoundingBox(min.x, min.y, max.x - min.x, max.y - min.y);
|
|
1037
1035
|
}
|
|
1038
|
-
/** overrideable */
|
|
1039
1036
|
getCommands() {
|
|
1040
|
-
return
|
|
1037
|
+
return this.getPoints().map((point, i) => {
|
|
1038
|
+
if (i === 0) {
|
|
1039
|
+
return { type: "M", x: point.x, y: point.y };
|
|
1040
|
+
} else {
|
|
1041
|
+
return { type: "L", x: point.x, y: point.y };
|
|
1042
|
+
}
|
|
1043
|
+
});
|
|
1041
1044
|
}
|
|
1042
1045
|
getData() {
|
|
1043
1046
|
return pathCommandsToPathData(this.getCommands());
|
|
@@ -1070,14 +1073,18 @@ class CircleCurve extends Curve {
|
|
|
1070
1073
|
}
|
|
1071
1074
|
getTangent(t) {
|
|
1072
1075
|
const { x, y } = this.getNormal(t);
|
|
1073
|
-
return new
|
|
1076
|
+
return new Vector2(-y, x);
|
|
1074
1077
|
}
|
|
1075
1078
|
getNormal(t) {
|
|
1076
1079
|
const { start, end } = this;
|
|
1077
1080
|
const _t = t * (end - start) + start - 0.5 * Math.PI;
|
|
1078
|
-
return new
|
|
1081
|
+
return new Vector2(Math.cos(_t), Math.sin(_t));
|
|
1082
|
+
}
|
|
1083
|
+
transformPoint(cb) {
|
|
1084
|
+
cb(this.center);
|
|
1085
|
+
return this;
|
|
1079
1086
|
}
|
|
1080
|
-
getMinMax(min =
|
|
1087
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1081
1088
|
min.x = Math.min(min.x, this.center.x - this.radius);
|
|
1082
1089
|
min.y = Math.min(min.y, this.center.y - this.radius);
|
|
1083
1090
|
max.x = Math.max(max.x, this.center.x + this.radius);
|
|
@@ -1125,54 +1132,54 @@ function cubicBezier(t, p0, p1, p2, p3) {
|
|
|
1125
1132
|
}
|
|
1126
1133
|
|
|
1127
1134
|
class CubicBezierCurve extends Curve {
|
|
1128
|
-
constructor(
|
|
1135
|
+
constructor(start = new Vector2(), startControl = new Vector2(), endControl = new Vector2(), end = new Vector2()) {
|
|
1129
1136
|
super();
|
|
1130
|
-
this.
|
|
1131
|
-
this.
|
|
1132
|
-
this.
|
|
1133
|
-
this.
|
|
1137
|
+
this.start = start;
|
|
1138
|
+
this.startControl = startControl;
|
|
1139
|
+
this.endControl = endControl;
|
|
1140
|
+
this.end = end;
|
|
1134
1141
|
}
|
|
1135
|
-
getPoint(t, output = new
|
|
1136
|
-
const {
|
|
1142
|
+
getPoint(t, output = new Vector2()) {
|
|
1143
|
+
const { start, startControl, endControl, end } = this;
|
|
1137
1144
|
output.set(
|
|
1138
|
-
cubicBezier(t,
|
|
1139
|
-
cubicBezier(t,
|
|
1145
|
+
cubicBezier(t, start.x, startControl.x, endControl.x, end.x),
|
|
1146
|
+
cubicBezier(t, start.y, startControl.y, endControl.y, end.y)
|
|
1140
1147
|
);
|
|
1141
1148
|
return output;
|
|
1142
1149
|
}
|
|
1143
|
-
|
|
1144
|
-
this.
|
|
1145
|
-
this.
|
|
1146
|
-
this.
|
|
1147
|
-
this.
|
|
1148
|
-
return this;
|
|
1149
|
-
}
|
|
1150
|
-
getMinMax(min =
|
|
1151
|
-
const {
|
|
1152
|
-
min.x = Math.min(min.x,
|
|
1153
|
-
min.y = Math.min(min.y,
|
|
1154
|
-
max.x = Math.max(max.x,
|
|
1155
|
-
max.y = Math.max(max.y,
|
|
1150
|
+
transformPoint(cb) {
|
|
1151
|
+
cb(this.start);
|
|
1152
|
+
cb(this.startControl);
|
|
1153
|
+
cb(this.endControl);
|
|
1154
|
+
cb(this.end);
|
|
1155
|
+
return this;
|
|
1156
|
+
}
|
|
1157
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1158
|
+
const { start, startControl, endControl, end } = this;
|
|
1159
|
+
min.x = Math.min(min.x, start.x, startControl.x, endControl.x, end.x);
|
|
1160
|
+
min.y = Math.min(min.y, start.y, startControl.y, endControl.y, end.y);
|
|
1161
|
+
max.x = Math.max(max.x, start.x, startControl.x, endControl.x, end.x);
|
|
1162
|
+
max.y = Math.max(max.y, start.y, startControl.y, endControl.y, end.y);
|
|
1156
1163
|
return { min, max };
|
|
1157
1164
|
}
|
|
1158
1165
|
getCommands() {
|
|
1159
|
-
const {
|
|
1166
|
+
const { start, startControl, endControl, end } = this;
|
|
1160
1167
|
return [
|
|
1161
|
-
{ type: "M", x:
|
|
1162
|
-
{ type: "C", x1:
|
|
1168
|
+
{ type: "M", x: start.x, y: start.y },
|
|
1169
|
+
{ type: "C", x1: startControl.x, y1: startControl.y, x2: endControl.x, y2: endControl.y, x: end.x, y: end.y }
|
|
1163
1170
|
];
|
|
1164
1171
|
}
|
|
1165
1172
|
drawTo(ctx) {
|
|
1166
|
-
const {
|
|
1167
|
-
ctx.bezierCurveTo(
|
|
1173
|
+
const { startControl, endControl, end } = this;
|
|
1174
|
+
ctx.bezierCurveTo(startControl.x, startControl.y, endControl.x, endControl.y, end.x, end.y);
|
|
1168
1175
|
return this;
|
|
1169
1176
|
}
|
|
1170
1177
|
copy(source) {
|
|
1171
1178
|
super.copy(source);
|
|
1172
|
-
this.
|
|
1173
|
-
this.
|
|
1174
|
-
this.
|
|
1175
|
-
this.
|
|
1179
|
+
this.start.copy(source.start);
|
|
1180
|
+
this.startControl.copy(source.startControl);
|
|
1181
|
+
this.endControl.copy(source.endControl);
|
|
1182
|
+
this.end.copy(source.end);
|
|
1176
1183
|
return this;
|
|
1177
1184
|
}
|
|
1178
1185
|
}
|
|
@@ -1180,12 +1187,11 @@ class CubicBezierCurve extends Curve {
|
|
|
1180
1187
|
const tempTransform0$1 = new Matrix3();
|
|
1181
1188
|
const tempTransform1$1 = new Matrix3();
|
|
1182
1189
|
const tempTransform2$1 = new Matrix3();
|
|
1183
|
-
const tempV2 = new
|
|
1190
|
+
const tempV2 = new Vector2();
|
|
1184
1191
|
class EllipseCurve extends Curve {
|
|
1185
|
-
constructor(
|
|
1192
|
+
constructor(center = new Vector2(), radiusX = 1, radiusY = 1, startAngle = 0, endAngle = Math.PI * 2, clockwise = false, rotation = 0) {
|
|
1186
1193
|
super();
|
|
1187
|
-
this.
|
|
1188
|
-
this.y = y;
|
|
1194
|
+
this.center = center;
|
|
1189
1195
|
this.radiusX = radiusX;
|
|
1190
1196
|
this.radiusY = radiusY;
|
|
1191
1197
|
this.startAngle = startAngle;
|
|
@@ -1193,7 +1199,7 @@ class EllipseCurve extends Curve {
|
|
|
1193
1199
|
this.clockwise = clockwise;
|
|
1194
1200
|
this.rotation = rotation;
|
|
1195
1201
|
}
|
|
1196
|
-
getPoint(t, output = new
|
|
1202
|
+
getPoint(t, output = new Vector2()) {
|
|
1197
1203
|
const twoPi = Math.PI * 2;
|
|
1198
1204
|
let deltaAngle = this.endAngle - this.startAngle;
|
|
1199
1205
|
const samePoints = Math.abs(deltaAngle) < Number.EPSILON;
|
|
@@ -1216,15 +1222,15 @@ class EllipseCurve extends Curve {
|
|
|
1216
1222
|
}
|
|
1217
1223
|
}
|
|
1218
1224
|
const angle = this.startAngle + t * deltaAngle;
|
|
1219
|
-
let _x = this.x + this.radiusX * Math.cos(angle);
|
|
1220
|
-
let _y = this.y + this.radiusY * Math.sin(angle);
|
|
1225
|
+
let _x = this.center.x + this.radiusX * Math.cos(angle);
|
|
1226
|
+
let _y = this.center.y + this.radiusY * Math.sin(angle);
|
|
1221
1227
|
if (this.rotation !== 0) {
|
|
1222
1228
|
const cos = Math.cos(this.rotation);
|
|
1223
1229
|
const sin = Math.sin(this.rotation);
|
|
1224
|
-
const tx = _x - this.x;
|
|
1225
|
-
const ty = _y - this.y;
|
|
1226
|
-
_x = tx * cos - ty * sin + this.x;
|
|
1227
|
-
_y = tx * sin + ty * cos + this.y;
|
|
1230
|
+
const tx = _x - this.center.x;
|
|
1231
|
+
const ty = _y - this.center.y;
|
|
1232
|
+
_x = tx * cos - ty * sin + this.center.x;
|
|
1233
|
+
_y = tx * sin + ty * cos + this.center.y;
|
|
1228
1234
|
}
|
|
1229
1235
|
return output.set(_x, _y);
|
|
1230
1236
|
}
|
|
@@ -1232,7 +1238,8 @@ class EllipseCurve extends Curve {
|
|
|
1232
1238
|
return divisions * 2;
|
|
1233
1239
|
}
|
|
1234
1240
|
getCommands() {
|
|
1235
|
-
const {
|
|
1241
|
+
const { center, radiusX: rx, radiusY: ry, startAngle, endAngle, clockwise, rotation } = this;
|
|
1242
|
+
const { x: cx, y: cy } = center;
|
|
1236
1243
|
const startX = cx + rx * Math.cos(startAngle) * Math.cos(rotation) - ry * Math.sin(startAngle) * Math.sin(rotation);
|
|
1237
1244
|
const startY = cy + rx * Math.cos(startAngle) * Math.sin(rotation) + ry * Math.sin(startAngle) * Math.cos(rotation);
|
|
1238
1245
|
const angleDiff = Math.abs(startAngle - endAngle);
|
|
@@ -1258,10 +1265,10 @@ class EllipseCurve extends Curve {
|
|
|
1258
1265
|
}
|
|
1259
1266
|
}
|
|
1260
1267
|
drawTo(ctx) {
|
|
1261
|
-
const {
|
|
1268
|
+
const { center, radiusX, radiusY, rotation, startAngle, endAngle, clockwise } = this;
|
|
1262
1269
|
ctx.ellipse(
|
|
1263
|
-
x,
|
|
1264
|
-
y,
|
|
1270
|
+
center.x,
|
|
1271
|
+
center.y,
|
|
1265
1272
|
radiusX,
|
|
1266
1273
|
radiusY,
|
|
1267
1274
|
rotation,
|
|
@@ -1272,10 +1279,10 @@ class EllipseCurve extends Curve {
|
|
|
1272
1279
|
return this;
|
|
1273
1280
|
}
|
|
1274
1281
|
transform(matrix) {
|
|
1275
|
-
tempV2.set(this.x, this.y);
|
|
1282
|
+
tempV2.set(this.center.x, this.center.y);
|
|
1276
1283
|
tempV2.applyMatrix3(matrix);
|
|
1277
|
-
this.x = tempV2.x;
|
|
1278
|
-
this.y = tempV2.y;
|
|
1284
|
+
this.center.x = tempV2.x;
|
|
1285
|
+
this.center.y = tempV2.y;
|
|
1279
1286
|
if (isTransformSkewed(matrix)) {
|
|
1280
1287
|
transfEllipseGeneric(this, matrix);
|
|
1281
1288
|
} else {
|
|
@@ -1283,8 +1290,13 @@ class EllipseCurve extends Curve {
|
|
|
1283
1290
|
}
|
|
1284
1291
|
return this;
|
|
1285
1292
|
}
|
|
1286
|
-
|
|
1287
|
-
|
|
1293
|
+
transformPoint(cb) {
|
|
1294
|
+
cb(this.center);
|
|
1295
|
+
return this;
|
|
1296
|
+
}
|
|
1297
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1298
|
+
const { center, radiusX: rx, radiusY: ry, rotation: theta } = this;
|
|
1299
|
+
const { x: cx, y: cy } = center;
|
|
1288
1300
|
const cosTheta = Math.cos(theta);
|
|
1289
1301
|
const sinTheta = Math.sin(theta);
|
|
1290
1302
|
const halfWidth = Math.sqrt(
|
|
@@ -1301,8 +1313,8 @@ class EllipseCurve extends Curve {
|
|
|
1301
1313
|
}
|
|
1302
1314
|
copy(source) {
|
|
1303
1315
|
super.copy(source);
|
|
1304
|
-
this.x = source.x;
|
|
1305
|
-
this.y = source.y;
|
|
1316
|
+
this.center.x = source.center.x;
|
|
1317
|
+
this.center.y = source.center.y;
|
|
1306
1318
|
this.radiusX = source.radiusX;
|
|
1307
1319
|
this.radiusY = source.radiusY;
|
|
1308
1320
|
this.startAngle = source.startAngle;
|
|
@@ -1317,8 +1329,8 @@ function transfEllipseGeneric(curve, m) {
|
|
|
1317
1329
|
const b = curve.radiusY;
|
|
1318
1330
|
const cosTheta = Math.cos(curve.rotation);
|
|
1319
1331
|
const sinTheta = Math.sin(curve.rotation);
|
|
1320
|
-
const v1 = new
|
|
1321
|
-
const v2 = new
|
|
1332
|
+
const v1 = new Vector2(a * cosTheta, a * sinTheta);
|
|
1333
|
+
const v2 = new Vector2(-b * sinTheta, b * cosTheta);
|
|
1322
1334
|
const f1 = v1.applyMatrix3(m);
|
|
1323
1335
|
const f2 = v2.applyMatrix3(m);
|
|
1324
1336
|
const mF = tempTransform0$1.set(
|
|
@@ -1368,7 +1380,7 @@ function transfEllipseGeneric(curve, m) {
|
|
|
1368
1380
|
);
|
|
1369
1381
|
const mDRF = mDsqrt.multiply(mRT).multiply(mF);
|
|
1370
1382
|
const transformAngle = (phi) => {
|
|
1371
|
-
const { x: cosR, y: sinR } = new
|
|
1383
|
+
const { x: cosR, y: sinR } = new Vector2(Math.cos(phi), Math.sin(phi)).applyMatrix3(mDRF);
|
|
1372
1384
|
return Math.atan2(sinR, cosR);
|
|
1373
1385
|
};
|
|
1374
1386
|
curve.startAngle = transformAngle(curve.startAngle);
|
|
@@ -1453,61 +1465,64 @@ function eigenDecomposition(A, B, C) {
|
|
|
1453
1465
|
}
|
|
1454
1466
|
|
|
1455
1467
|
class LineCurve extends Curve {
|
|
1456
|
-
constructor(
|
|
1468
|
+
constructor(start = new Vector2(), end = new Vector2()) {
|
|
1457
1469
|
super();
|
|
1458
|
-
this.
|
|
1459
|
-
this.
|
|
1470
|
+
this.start = start;
|
|
1471
|
+
this.end = end;
|
|
1460
1472
|
}
|
|
1461
|
-
getPoint(t, output = new
|
|
1473
|
+
getPoint(t, output = new Vector2()) {
|
|
1462
1474
|
if (t === 1) {
|
|
1463
|
-
output.copy(this.
|
|
1475
|
+
output.copy(this.end);
|
|
1464
1476
|
} else {
|
|
1465
|
-
output.copy(this.
|
|
1466
|
-
output.multiplyScalar(t).add(this.v1);
|
|
1477
|
+
output.copy(this.end).sub(this.start).multiplyScalar(t).add(this.start);
|
|
1467
1478
|
}
|
|
1468
1479
|
return output;
|
|
1469
1480
|
}
|
|
1470
|
-
getPointAt(u, output = new
|
|
1481
|
+
getPointAt(u, output = new Vector2()) {
|
|
1471
1482
|
return this.getPoint(u, output);
|
|
1472
1483
|
}
|
|
1473
|
-
getTangent(
|
|
1474
|
-
return output.subVectors(this.
|
|
1484
|
+
getTangent(_t, output = new Vector2()) {
|
|
1485
|
+
return output.subVectors(this.end, this.start).normalize();
|
|
1475
1486
|
}
|
|
1476
|
-
getTangentAt(u, output = new
|
|
1487
|
+
getTangentAt(u, output = new Vector2()) {
|
|
1477
1488
|
return this.getTangent(u, output);
|
|
1478
1489
|
}
|
|
1479
|
-
|
|
1480
|
-
this.
|
|
1481
|
-
|
|
1490
|
+
getNormal(t, output = new Vector2()) {
|
|
1491
|
+
const { x, y } = this.getPoint(t).sub(this.start);
|
|
1492
|
+
return output.set(y, -x).normalize();
|
|
1493
|
+
}
|
|
1494
|
+
transformPoint(cb) {
|
|
1495
|
+
cb(this.start);
|
|
1496
|
+
cb(this.end);
|
|
1482
1497
|
return this;
|
|
1483
1498
|
}
|
|
1484
1499
|
getDivisions() {
|
|
1485
1500
|
return 1;
|
|
1486
1501
|
}
|
|
1487
|
-
getMinMax(min =
|
|
1488
|
-
const {
|
|
1489
|
-
min.x = Math.min(min.x,
|
|
1490
|
-
min.y = Math.min(min.y,
|
|
1491
|
-
max.x = Math.max(max.x,
|
|
1492
|
-
max.y = Math.max(max.y,
|
|
1502
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1503
|
+
const { start, end } = this;
|
|
1504
|
+
min.x = Math.min(min.x, start.x, end.x);
|
|
1505
|
+
min.y = Math.min(min.y, start.y, end.y);
|
|
1506
|
+
max.x = Math.max(max.x, start.x, end.x);
|
|
1507
|
+
max.y = Math.max(max.y, start.y, end.y);
|
|
1493
1508
|
return { min, max };
|
|
1494
1509
|
}
|
|
1495
1510
|
getCommands() {
|
|
1496
|
-
const {
|
|
1511
|
+
const { start, end } = this;
|
|
1497
1512
|
return [
|
|
1498
|
-
{ type: "M", x:
|
|
1499
|
-
{ type: "L", x:
|
|
1513
|
+
{ type: "M", x: start.x, y: start.y },
|
|
1514
|
+
{ type: "L", x: end.x, y: end.y }
|
|
1500
1515
|
];
|
|
1501
1516
|
}
|
|
1502
1517
|
drawTo(ctx) {
|
|
1503
|
-
const {
|
|
1504
|
-
ctx.lineTo(
|
|
1518
|
+
const { end } = this;
|
|
1519
|
+
ctx.lineTo(end.x, end.y);
|
|
1505
1520
|
return this;
|
|
1506
1521
|
}
|
|
1507
1522
|
copy(source) {
|
|
1508
1523
|
super.copy(source);
|
|
1509
|
-
this.
|
|
1510
|
-
this.
|
|
1524
|
+
this.start.copy(source.start);
|
|
1525
|
+
this.end.copy(source.end);
|
|
1511
1526
|
return this;
|
|
1512
1527
|
}
|
|
1513
1528
|
}
|
|
@@ -1525,66 +1540,68 @@ class HeartCurve extends Curve {
|
|
|
1525
1540
|
this.size = size;
|
|
1526
1541
|
this.start = start;
|
|
1527
1542
|
this.end = end;
|
|
1528
|
-
__publicField$4(this, "
|
|
1529
|
-
|
|
1543
|
+
__publicField$4(this, "curveT", 0);
|
|
1544
|
+
this.update();
|
|
1545
|
+
}
|
|
1546
|
+
update() {
|
|
1530
1547
|
const { x, y } = this.center;
|
|
1531
|
-
const A = new
|
|
1532
|
-
const t = new
|
|
1533
|
-
const i = new
|
|
1548
|
+
const A = new Vector2(x + 0.5 * this.size, y - 0.5 * this.size);
|
|
1549
|
+
const t = new Vector2(x - 0.5 * this.size, y - 0.5 * this.size);
|
|
1550
|
+
const i = new Vector2(x, y + 0.5 * this.size);
|
|
1534
1551
|
const curve1 = new CircleCurve(A, Math.SQRT1_2 * this.size, -0.25 * Math.PI, 0.75 * Math.PI);
|
|
1535
1552
|
const curve5 = new CircleCurve(t, Math.SQRT1_2 * this.size, -0.75 * Math.PI, 0.25 * Math.PI);
|
|
1536
1553
|
const curve3 = new CircleCurve(i, 0.5 * Math.SQRT1_2 * this.size, 0.75 * Math.PI, 1.25 * Math.PI);
|
|
1537
|
-
const e = new
|
|
1538
|
-
const l = new
|
|
1539
|
-
const c = new
|
|
1540
|
-
const h = new
|
|
1541
|
-
const a = new
|
|
1554
|
+
const e = new Vector2(x, y + this.size);
|
|
1555
|
+
const l = new Vector2(x + this.size, y);
|
|
1556
|
+
const c = new Vector2().lerpVectors(l, e, 0.75);
|
|
1557
|
+
const h = new Vector2(x - this.size, y);
|
|
1558
|
+
const a = new Vector2().lerpVectors(h, e, 0.75);
|
|
1542
1559
|
const curve2 = new LineCurve(l, c);
|
|
1543
1560
|
const curve4 = new LineCurve(a, h);
|
|
1544
1561
|
this.curves = [curve1, curve2, curve3, curve4, curve5];
|
|
1562
|
+
return this;
|
|
1545
1563
|
}
|
|
1546
|
-
getPoint(
|
|
1547
|
-
return this.
|
|
1564
|
+
getPoint(t) {
|
|
1565
|
+
return this.getCurve(t).getPoint(this.curveT);
|
|
1548
1566
|
}
|
|
1549
|
-
getPointAt(
|
|
1550
|
-
return this.getPoint(
|
|
1567
|
+
getPointAt(t) {
|
|
1568
|
+
return this.getPoint(t);
|
|
1551
1569
|
}
|
|
1552
|
-
|
|
1553
|
-
let val = (
|
|
1570
|
+
getCurve(t) {
|
|
1571
|
+
let val = (t * (this.end - this.start) + this.start) % 1;
|
|
1554
1572
|
val < 0 && (val += 1);
|
|
1555
1573
|
val *= 9 * Math.PI / 8 + 1.5;
|
|
1556
1574
|
let index;
|
|
1557
|
-
const
|
|
1558
|
-
if (val <
|
|
1575
|
+
const PI_1_2 = 0.5 * Math.PI;
|
|
1576
|
+
if (val < PI_1_2) {
|
|
1559
1577
|
index = 0;
|
|
1560
|
-
this.
|
|
1561
|
-
} else if (val <
|
|
1578
|
+
this.curveT = val / PI_1_2;
|
|
1579
|
+
} else if (val < PI_1_2 + 0.75) {
|
|
1562
1580
|
index = 1;
|
|
1563
|
-
this.
|
|
1581
|
+
this.curveT = (val - PI_1_2) / 0.75;
|
|
1564
1582
|
} else if (val < 5 * Math.PI / 8 + 0.75) {
|
|
1565
1583
|
index = 2;
|
|
1566
|
-
this.
|
|
1584
|
+
this.curveT = (val - PI_1_2 - 0.75) / (Math.PI / 8);
|
|
1567
1585
|
} else if (val < 5 * Math.PI / 8 + 1.5) {
|
|
1568
1586
|
index = 3;
|
|
1569
|
-
this.
|
|
1587
|
+
this.curveT = (val - 5 * Math.PI / 8 - 0.75) / 0.75;
|
|
1570
1588
|
} else {
|
|
1571
1589
|
index = 4;
|
|
1572
|
-
this.
|
|
1590
|
+
this.curveT = (val - 5 * Math.PI / 8 - 1.5) / PI_1_2;
|
|
1573
1591
|
}
|
|
1574
1592
|
return this.curves[index];
|
|
1575
1593
|
}
|
|
1576
|
-
getTangent(
|
|
1577
|
-
return this.
|
|
1594
|
+
getTangent(t) {
|
|
1595
|
+
return this.getCurve(t).getTangent(this.curveT);
|
|
1578
1596
|
}
|
|
1579
|
-
getNormal(
|
|
1580
|
-
|
|
1581
|
-
return new Point2D(line.v2.y - line.v1.y, -(line.v2.x - line.v1.x)).normalize();
|
|
1597
|
+
getNormal(t) {
|
|
1598
|
+
return this.getCurve(t).getNormal(this.curveT);
|
|
1582
1599
|
}
|
|
1583
|
-
|
|
1584
|
-
this.curves.forEach((curve) => curve.
|
|
1600
|
+
transformPoint(cb) {
|
|
1601
|
+
this.curves.forEach((curve) => curve.transformPoint(cb));
|
|
1585
1602
|
return this;
|
|
1586
1603
|
}
|
|
1587
|
-
getMinMax(min =
|
|
1604
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1588
1605
|
this.curves.forEach((curve) => curve.getMinMax(min, max));
|
|
1589
1606
|
return { min, max };
|
|
1590
1607
|
}
|
|
@@ -1604,54 +1621,59 @@ var __publicField$3 = (obj, key, value) => {
|
|
|
1604
1621
|
return value;
|
|
1605
1622
|
};
|
|
1606
1623
|
class PloygonCurve extends Curve {
|
|
1607
|
-
constructor(center, radius = 0,
|
|
1624
|
+
constructor(center, radius = 0, number = 0, start = 0, end = 1) {
|
|
1608
1625
|
super();
|
|
1609
1626
|
this.center = center;
|
|
1610
1627
|
this.radius = radius;
|
|
1611
|
-
this.
|
|
1628
|
+
this.number = number;
|
|
1612
1629
|
this.start = start;
|
|
1613
1630
|
this.end = end;
|
|
1614
1631
|
__publicField$3(this, "curves", []);
|
|
1632
|
+
__publicField$3(this, "curveT", 0);
|
|
1615
1633
|
__publicField$3(this, "points", []);
|
|
1616
|
-
|
|
1617
|
-
|
|
1634
|
+
this.update();
|
|
1635
|
+
}
|
|
1636
|
+
update() {
|
|
1637
|
+
for (let i = 0; i < this.number; i++) {
|
|
1638
|
+
let radian = i * 2 * Math.PI / this.number;
|
|
1618
1639
|
radian -= 0.5 * Math.PI;
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
|
|
1640
|
+
this.points.push(
|
|
1641
|
+
new Vector2(
|
|
1642
|
+
this.radius * Math.cos(radian),
|
|
1643
|
+
this.radius * Math.sin(radian)
|
|
1644
|
+
).add(this.center)
|
|
1645
|
+
);
|
|
1622
1646
|
}
|
|
1623
|
-
for (let i = 0; i < this.
|
|
1624
|
-
this.curves.push(new LineCurve(this.points[i], this.points[(i + 1) % this.
|
|
1647
|
+
for (let i = 0; i < this.number; i++) {
|
|
1648
|
+
this.curves.push(new LineCurve(this.points[i], this.points[(i + 1) % this.number]));
|
|
1625
1649
|
}
|
|
1650
|
+
return this;
|
|
1626
1651
|
}
|
|
1627
|
-
|
|
1628
|
-
this.
|
|
1629
|
-
return this.currentLine.getPoint(this.pointK);
|
|
1630
|
-
}
|
|
1631
|
-
getPointAt(value) {
|
|
1632
|
-
return this.getPoint(value);
|
|
1633
|
-
}
|
|
1634
|
-
getCurrentLine(value) {
|
|
1635
|
-
let pos = (value * (this.end - this.start) + this.start) % 1;
|
|
1652
|
+
getCurve(t) {
|
|
1653
|
+
let pos = (t * (this.end - this.start) + this.start) % 1;
|
|
1636
1654
|
pos < 0 && (pos += 1);
|
|
1637
|
-
const v = pos * this.
|
|
1655
|
+
const v = pos * this.number;
|
|
1638
1656
|
const index = Math.floor(v);
|
|
1639
|
-
this.
|
|
1640
|
-
|
|
1641
|
-
return this.currentLine;
|
|
1657
|
+
this.curveT = v - index;
|
|
1658
|
+
return this.curves[index];
|
|
1642
1659
|
}
|
|
1643
|
-
|
|
1644
|
-
return this.
|
|
1660
|
+
getPoint(t, output) {
|
|
1661
|
+
return this.getCurve(t).getPoint(this.curveT, output);
|
|
1645
1662
|
}
|
|
1646
|
-
|
|
1647
|
-
|
|
1648
|
-
return new Point2D(line.v2.y - line.v1.y, -(line.v2.x - line.v1.x)).normalize();
|
|
1663
|
+
getPointAt(u, output) {
|
|
1664
|
+
return this.getPoint(u, output);
|
|
1649
1665
|
}
|
|
1650
|
-
|
|
1651
|
-
this.
|
|
1666
|
+
getTangent(t, output) {
|
|
1667
|
+
return this.getCurve(t).getTangent(this.curveT, output);
|
|
1668
|
+
}
|
|
1669
|
+
getNormal(t, output) {
|
|
1670
|
+
return this.getCurve(t).getNormal(this.curveT, output);
|
|
1671
|
+
}
|
|
1672
|
+
transformPoint(cb) {
|
|
1673
|
+
this.curves.forEach((curve) => curve.transformPoint(cb));
|
|
1652
1674
|
return this;
|
|
1653
1675
|
}
|
|
1654
|
-
getMinMax(min =
|
|
1676
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1655
1677
|
this.curves.forEach((curve) => curve.getMinMax(min, max));
|
|
1656
1678
|
return { min, max };
|
|
1657
1679
|
}
|
|
@@ -1665,55 +1687,55 @@ class PloygonCurve extends Curve {
|
|
|
1665
1687
|
}
|
|
1666
1688
|
|
|
1667
1689
|
class QuadraticBezierCurve extends Curve {
|
|
1668
|
-
constructor(
|
|
1690
|
+
constructor(start = new Vector2(), control = new Vector2(), end = new Vector2()) {
|
|
1669
1691
|
super();
|
|
1670
|
-
this.
|
|
1671
|
-
this.
|
|
1672
|
-
this.
|
|
1692
|
+
this.start = start;
|
|
1693
|
+
this.control = control;
|
|
1694
|
+
this.end = end;
|
|
1673
1695
|
}
|
|
1674
|
-
getPoint(t, output = new
|
|
1675
|
-
const {
|
|
1696
|
+
getPoint(t, output = new Vector2()) {
|
|
1697
|
+
const { start, control, end } = this;
|
|
1676
1698
|
output.set(
|
|
1677
|
-
quadraticBezier(t,
|
|
1678
|
-
quadraticBezier(t,
|
|
1699
|
+
quadraticBezier(t, start.x, control.x, end.x),
|
|
1700
|
+
quadraticBezier(t, start.y, control.y, end.y)
|
|
1679
1701
|
);
|
|
1680
1702
|
return output;
|
|
1681
1703
|
}
|
|
1682
|
-
|
|
1683
|
-
this.
|
|
1684
|
-
this.
|
|
1685
|
-
this.
|
|
1686
|
-
return this;
|
|
1687
|
-
}
|
|
1688
|
-
getMinMax(min =
|
|
1689
|
-
const {
|
|
1690
|
-
const x1 = 0.5 * (
|
|
1691
|
-
const y1 = 0.5 * (
|
|
1692
|
-
const x2 = 0.5 * (
|
|
1693
|
-
const y2 = 0.5 * (
|
|
1694
|
-
min.x = Math.min(min.x,
|
|
1695
|
-
min.y = Math.min(min.y,
|
|
1696
|
-
max.x = Math.max(max.x,
|
|
1697
|
-
max.y = Math.max(max.y,
|
|
1704
|
+
transformPoint(cb) {
|
|
1705
|
+
cb(this.start);
|
|
1706
|
+
cb(this.control);
|
|
1707
|
+
cb(this.end);
|
|
1708
|
+
return this;
|
|
1709
|
+
}
|
|
1710
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1711
|
+
const { start, control, end } = this;
|
|
1712
|
+
const x1 = 0.5 * (start.x + control.x);
|
|
1713
|
+
const y1 = 0.5 * (start.y + control.y);
|
|
1714
|
+
const x2 = 0.5 * (start.x + end.x);
|
|
1715
|
+
const y2 = 0.5 * (start.y + end.y);
|
|
1716
|
+
min.x = Math.min(min.x, start.x, end.x, x1, x2);
|
|
1717
|
+
min.y = Math.min(min.y, start.y, end.y, y1, y2);
|
|
1718
|
+
max.x = Math.max(max.x, start.x, end.x, x1, x2);
|
|
1719
|
+
max.y = Math.max(max.y, start.y, end.y, y1, y2);
|
|
1698
1720
|
return { min, max };
|
|
1699
1721
|
}
|
|
1700
1722
|
getCommands() {
|
|
1701
|
-
const {
|
|
1723
|
+
const { start, control, end } = this;
|
|
1702
1724
|
return [
|
|
1703
|
-
{ type: "M", x:
|
|
1704
|
-
{ type: "Q", x1:
|
|
1725
|
+
{ type: "M", x: start.x, y: start.y },
|
|
1726
|
+
{ type: "Q", x1: control.x, y1: control.y, x: end.x, y: end.y }
|
|
1705
1727
|
];
|
|
1706
1728
|
}
|
|
1707
1729
|
drawTo(ctx) {
|
|
1708
|
-
const {
|
|
1709
|
-
ctx.quadraticCurveTo(
|
|
1730
|
+
const { control, end } = this;
|
|
1731
|
+
ctx.quadraticCurveTo(control.x, control.y, end.x, end.y);
|
|
1710
1732
|
return this;
|
|
1711
1733
|
}
|
|
1712
1734
|
copy(source) {
|
|
1713
1735
|
super.copy(source);
|
|
1714
|
-
this.
|
|
1715
|
-
this.
|
|
1716
|
-
this.
|
|
1736
|
+
this.start.copy(source.start);
|
|
1737
|
+
this.control.copy(source.control);
|
|
1738
|
+
this.end.copy(source.end);
|
|
1717
1739
|
return this;
|
|
1718
1740
|
}
|
|
1719
1741
|
}
|
|
@@ -1733,19 +1755,8 @@ class RectangularCurve extends Curve {
|
|
|
1733
1755
|
this.start = start;
|
|
1734
1756
|
this.end = end;
|
|
1735
1757
|
__publicField$2(this, "curves", []);
|
|
1736
|
-
__publicField$2(this, "
|
|
1737
|
-
|
|
1738
|
-
const offsetX = this.rx;
|
|
1739
|
-
const offsetY = this.rx / this.aspectRatio;
|
|
1740
|
-
const points = [
|
|
1741
|
-
new Point2D(x - offsetX, y - offsetY),
|
|
1742
|
-
new Point2D(x + offsetX, y - offsetY),
|
|
1743
|
-
new Point2D(x + offsetX, y + offsetY),
|
|
1744
|
-
new Point2D(x - offsetX, y + offsetY)
|
|
1745
|
-
];
|
|
1746
|
-
for (let i = 0; i < 4; i++) {
|
|
1747
|
-
this.curves.push(new LineCurve(points[i].clone(), points[(i + 1) % 4].clone()));
|
|
1748
|
-
}
|
|
1758
|
+
__publicField$2(this, "curveT", 0);
|
|
1759
|
+
this.update();
|
|
1749
1760
|
}
|
|
1750
1761
|
get x() {
|
|
1751
1762
|
return this.center.x - this.rx;
|
|
@@ -1759,44 +1770,58 @@ class RectangularCurve extends Curve {
|
|
|
1759
1770
|
get height() {
|
|
1760
1771
|
return this.rx / this.aspectRatio * 2;
|
|
1761
1772
|
}
|
|
1762
|
-
|
|
1763
|
-
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1773
|
+
update() {
|
|
1774
|
+
const { x, y } = this.center;
|
|
1775
|
+
const offsetX = this.rx;
|
|
1776
|
+
const offsetY = this.rx / this.aspectRatio;
|
|
1777
|
+
const points = [
|
|
1778
|
+
new Vector2(x - offsetX, y - offsetY),
|
|
1779
|
+
new Vector2(x + offsetX, y - offsetY),
|
|
1780
|
+
new Vector2(x + offsetX, y + offsetY),
|
|
1781
|
+
new Vector2(x - offsetX, y + offsetY)
|
|
1782
|
+
];
|
|
1783
|
+
for (let i = 0; i < 4; i++) {
|
|
1784
|
+
this.curves.push(new LineCurve(points[i].clone(), points[(i + 1) % 4].clone()));
|
|
1785
|
+
}
|
|
1786
|
+
return this;
|
|
1767
1787
|
}
|
|
1768
|
-
|
|
1769
|
-
let
|
|
1770
|
-
|
|
1771
|
-
|
|
1788
|
+
getCurve(t) {
|
|
1789
|
+
let current = (t * (this.end - this.start) + this.start) % 1;
|
|
1790
|
+
current < 0 && (current += 1);
|
|
1791
|
+
current *= (1 + this.aspectRatio) * 2;
|
|
1772
1792
|
let i;
|
|
1773
|
-
if (
|
|
1793
|
+
if (current < this.aspectRatio) {
|
|
1774
1794
|
i = 0;
|
|
1775
|
-
this.
|
|
1776
|
-
} else if (
|
|
1795
|
+
this.curveT = current / this.aspectRatio;
|
|
1796
|
+
} else if (current < this.aspectRatio + 1) {
|
|
1777
1797
|
i = 1;
|
|
1778
|
-
this.
|
|
1779
|
-
} else if (
|
|
1798
|
+
this.curveT = (current - this.aspectRatio) / 1;
|
|
1799
|
+
} else if (current < 2 * this.aspectRatio + 1) {
|
|
1780
1800
|
i = 2;
|
|
1781
|
-
this.
|
|
1801
|
+
this.curveT = (current - this.aspectRatio - 1) / this.aspectRatio;
|
|
1782
1802
|
} else {
|
|
1783
1803
|
i = 3;
|
|
1784
|
-
this.
|
|
1804
|
+
this.curveT = (current - 2 * this.aspectRatio - 1) / 1;
|
|
1785
1805
|
}
|
|
1786
1806
|
return this.curves[i];
|
|
1787
1807
|
}
|
|
1788
|
-
|
|
1789
|
-
return this.
|
|
1808
|
+
getPoint(t, output) {
|
|
1809
|
+
return this.getCurve(t).getPoint(this.curveT, output);
|
|
1790
1810
|
}
|
|
1791
|
-
|
|
1792
|
-
|
|
1793
|
-
return new Point2D(v2.y - v1.y, -(v2.x - v1.x)).normalize();
|
|
1811
|
+
getPointAt(u, output) {
|
|
1812
|
+
return this.getPoint(u, output);
|
|
1794
1813
|
}
|
|
1795
|
-
|
|
1796
|
-
this.
|
|
1814
|
+
getTangent(t, output) {
|
|
1815
|
+
return this.getCurve(t).getTangent(this.curveT, output);
|
|
1816
|
+
}
|
|
1817
|
+
getNormal(t, output) {
|
|
1818
|
+
return this.getCurve(t).getNormal(this.curveT, output);
|
|
1819
|
+
}
|
|
1820
|
+
transformPoint(cb) {
|
|
1821
|
+
this.curves.forEach((curve) => curve.transformPoint(cb));
|
|
1797
1822
|
return this;
|
|
1798
1823
|
}
|
|
1799
|
-
getMinMax(min =
|
|
1824
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
1800
1825
|
this.curves.forEach((curve) => curve.getMinMax(min, max));
|
|
1801
1826
|
return { min, max };
|
|
1802
1827
|
}
|
|
@@ -1817,7 +1842,7 @@ class SplineCurve extends Curve {
|
|
|
1817
1842
|
getDivisions(divisions = 12) {
|
|
1818
1843
|
return divisions * this.points.length;
|
|
1819
1844
|
}
|
|
1820
|
-
getPoint(t, output = new
|
|
1845
|
+
getPoint(t, output = new Vector2()) {
|
|
1821
1846
|
const { points } = this;
|
|
1822
1847
|
const p = (points.length - 1) * t;
|
|
1823
1848
|
const _p = Math.floor(p);
|
|
@@ -1832,6 +1857,10 @@ class SplineCurve extends Curve {
|
|
|
1832
1857
|
);
|
|
1833
1858
|
return output;
|
|
1834
1859
|
}
|
|
1860
|
+
transformPoint(cb) {
|
|
1861
|
+
this.points.forEach((point) => cb(point));
|
|
1862
|
+
return this;
|
|
1863
|
+
}
|
|
1835
1864
|
copy(source) {
|
|
1836
1865
|
super.copy(source);
|
|
1837
1866
|
this.points = [];
|
|
@@ -1852,7 +1881,7 @@ class CurvePath extends Curve {
|
|
|
1852
1881
|
constructor(points) {
|
|
1853
1882
|
super();
|
|
1854
1883
|
__publicField$1(this, "curves", []);
|
|
1855
|
-
__publicField$1(this, "currentPoint", new
|
|
1884
|
+
__publicField$1(this, "currentPoint", new Vector2());
|
|
1856
1885
|
__publicField$1(this, "autoClose", false);
|
|
1857
1886
|
__publicField$1(this, "_cacheLengths", []);
|
|
1858
1887
|
if (points) {
|
|
@@ -1871,7 +1900,7 @@ class CurvePath extends Curve {
|
|
|
1871
1900
|
}
|
|
1872
1901
|
return this;
|
|
1873
1902
|
}
|
|
1874
|
-
getPoint(position, output = new
|
|
1903
|
+
getPoint(position, output = new Vector2()) {
|
|
1875
1904
|
const d = position * this.getLength();
|
|
1876
1905
|
const curveLengths = this.getCurveLengths();
|
|
1877
1906
|
let i = 0;
|
|
@@ -1923,10 +1952,10 @@ class CurvePath extends Curve {
|
|
|
1923
1952
|
let last;
|
|
1924
1953
|
for (let i = 0, curves = this.curves; i < curves.length; i++) {
|
|
1925
1954
|
const curve = curves[i];
|
|
1926
|
-
const
|
|
1927
|
-
for (let i2 = 0; i2 <
|
|
1928
|
-
const point =
|
|
1929
|
-
if (last
|
|
1955
|
+
const curvePoints = curve.getPoints(curve.getDivisions(divisions));
|
|
1956
|
+
for (let i2 = 0; i2 < curvePoints.length; i2++) {
|
|
1957
|
+
const point = curvePoints[i2];
|
|
1958
|
+
if (last?.equals(point))
|
|
1930
1959
|
continue;
|
|
1931
1960
|
points.push(point);
|
|
1932
1961
|
last = point;
|
|
@@ -1948,9 +1977,9 @@ class CurvePath extends Curve {
|
|
|
1948
1977
|
this.curves.push(
|
|
1949
1978
|
new CubicBezierCurve(
|
|
1950
1979
|
this.currentPoint.clone(),
|
|
1951
|
-
new
|
|
1952
|
-
new
|
|
1953
|
-
new
|
|
1980
|
+
new Vector2(cp1x, cp1y),
|
|
1981
|
+
new Vector2(cp2x, cp2y),
|
|
1982
|
+
new Vector2(x, y)
|
|
1954
1983
|
)
|
|
1955
1984
|
);
|
|
1956
1985
|
this.currentPoint.set(x, y);
|
|
@@ -1960,7 +1989,7 @@ class CurvePath extends Curve {
|
|
|
1960
1989
|
this.curves.push(
|
|
1961
1990
|
new LineCurve(
|
|
1962
1991
|
this.currentPoint.clone(),
|
|
1963
|
-
new
|
|
1992
|
+
new Vector2(x, y)
|
|
1964
1993
|
)
|
|
1965
1994
|
);
|
|
1966
1995
|
this.currentPoint.set(x, y);
|
|
@@ -1974,8 +2003,8 @@ class CurvePath extends Curve {
|
|
|
1974
2003
|
this.curves.push(
|
|
1975
2004
|
new QuadraticBezierCurve(
|
|
1976
2005
|
this.currentPoint.clone(),
|
|
1977
|
-
new
|
|
1978
|
-
new
|
|
2006
|
+
new Vector2(cpx, cpy),
|
|
2007
|
+
new Vector2(x, y)
|
|
1979
2008
|
)
|
|
1980
2009
|
);
|
|
1981
2010
|
this.currentPoint.set(x, y);
|
|
@@ -1984,7 +2013,7 @@ class CurvePath extends Curve {
|
|
|
1984
2013
|
rect(x, y, w, h) {
|
|
1985
2014
|
this.curves.push(
|
|
1986
2015
|
new RectangularCurve(
|
|
1987
|
-
new
|
|
2016
|
+
new Vector2(x + w / 2, y + h / 2),
|
|
1988
2017
|
w / 2,
|
|
1989
2018
|
w / h
|
|
1990
2019
|
)
|
|
@@ -2013,11 +2042,19 @@ class CurvePath extends Curve {
|
|
|
2013
2042
|
return this;
|
|
2014
2043
|
}
|
|
2015
2044
|
absellipse(x, y, radiusX, radiusY, startAngle, endAngle, clockwise = false, rotation = 0) {
|
|
2016
|
-
const curve = new EllipseCurve(
|
|
2045
|
+
const curve = new EllipseCurve(
|
|
2046
|
+
new Vector2(x, y),
|
|
2047
|
+
radiusX,
|
|
2048
|
+
radiusY,
|
|
2049
|
+
startAngle,
|
|
2050
|
+
endAngle,
|
|
2051
|
+
clockwise,
|
|
2052
|
+
rotation
|
|
2053
|
+
);
|
|
2017
2054
|
if (this.curves.length > 0) {
|
|
2018
|
-
const
|
|
2019
|
-
if (!
|
|
2020
|
-
this.lineTo(
|
|
2055
|
+
const first = curve.getPoint(0);
|
|
2056
|
+
if (!first.equals(this.currentPoint)) {
|
|
2057
|
+
this.lineTo(first.x, first.y);
|
|
2021
2058
|
}
|
|
2022
2059
|
}
|
|
2023
2060
|
this.curves.push(curve);
|
|
@@ -2027,7 +2064,7 @@ class CurvePath extends Curve {
|
|
|
2027
2064
|
getCommands() {
|
|
2028
2065
|
return this.curves.flatMap((curve) => curve.getCommands());
|
|
2029
2066
|
}
|
|
2030
|
-
getMinMax(min =
|
|
2067
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
2031
2068
|
this.curves.forEach((curve) => curve.getMinMax(min, max));
|
|
2032
2069
|
return { min, max };
|
|
2033
2070
|
}
|
|
@@ -2145,11 +2182,15 @@ class Path2D {
|
|
|
2145
2182
|
this.paths.forEach((path) => path.curves.forEach((curve) => cb(curve)));
|
|
2146
2183
|
return this;
|
|
2147
2184
|
}
|
|
2185
|
+
transformPoint(cb) {
|
|
2186
|
+
this.forEachCurve((curve) => curve.transformPoint(cb));
|
|
2187
|
+
return this;
|
|
2188
|
+
}
|
|
2148
2189
|
transform(matrix) {
|
|
2149
2190
|
this.forEachCurve((curve) => curve.transform(matrix));
|
|
2150
2191
|
return this;
|
|
2151
2192
|
}
|
|
2152
|
-
getMinMax(min =
|
|
2193
|
+
getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
|
|
2153
2194
|
this.forEachCurve((curve) => curve.getMinMax(min, max));
|
|
2154
2195
|
return { min, max };
|
|
2155
2196
|
}
|
|
@@ -2746,9 +2787,9 @@ exports.LineCurve = LineCurve;
|
|
|
2746
2787
|
exports.Matrix3 = Matrix3;
|
|
2747
2788
|
exports.Path2D = Path2D;
|
|
2748
2789
|
exports.PloygonCurve = PloygonCurve;
|
|
2749
|
-
exports.Point2D = Point2D;
|
|
2750
2790
|
exports.QuadraticBezierCurve = QuadraticBezierCurve;
|
|
2751
2791
|
exports.RectangularCurve = RectangularCurve;
|
|
2752
2792
|
exports.SplineCurve = SplineCurve;
|
|
2793
|
+
exports.Vector2 = Vector2;
|
|
2753
2794
|
exports.parseSvg = parseSvg;
|
|
2754
2795
|
exports.parseSvgToDom = parseSvgToDom;
|