@remotion/paths 4.0.166 → 4.0.168
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/cut-instruction.d.ts +11 -0
- package/dist/cut-instruction.js +64 -0
- package/dist/cut-path.d.ts +1 -0
- package/dist/cut-path.js +38 -0
- package/dist/evolve-path.js +11 -0
- package/dist/get-bounding-box.js +1 -20
- package/dist/helpers/convert-q-to-c-instruction.d.ts +2 -0
- package/dist/helpers/convert-q-to-c-instruction.js +19 -0
- package/dist/helpers/iterate.d.ts +5 -5
- package/dist/helpers/reduced-analysis.d.ts +13 -0
- package/dist/helpers/reduced-analysis.js +89 -0
- package/dist/helpers/remove-a-s-t-curves.d.ts +1 -1
- package/dist/helpers/remove-a-s-t-curves.js +9 -5
- package/dist/helpers/types.d.ts +2 -2
- package/dist/index.d.ts +1 -0
- package/dist/index.js +3 -1
- package/dist/interpolate-path/convert-to-same-instruction-type.js +0 -38
- package/dist/interpolate-path/interpolate-instruction-of-same-kind.d.ts +2 -2
- package/dist/interpolate-path/interpolate-instruction-of-same-kind.js +0 -15
- package/dist/interpolate-path/points-to-command.js +6 -2
- package/dist/interpolate-path/split-segment.js +1 -3
- package/dist/reduce-instructions.js +1 -1
- package/dist/warp-path/warp-helpers.js +7 -25
- package/package.json +1 -1
- package/dist/helpers/split-curve.d.ts +0 -47
- package/dist/helpers/split-curve.js +0 -190
- package/dist/interpolate-path/array-of-length.d.ts +0 -1
- package/dist/interpolate-path/array-of-length.js +0 -11
- package/dist/interpolate-path/command-to-string.d.ts +0 -7
- package/dist/interpolate-path/command-to-string.js +0 -15
- package/dist/interpolate-path/command.d.ts +0 -37
- package/dist/interpolate-path/command.js +0 -28
- package/dist/interpolate-path/convert-to-same-type.d.ts +0 -22
- package/dist/interpolate-path/convert-to-same-type.js +0 -68
- package/dist/interpolate-path/interpolate-commands.d.ts +0 -16
- package/dist/interpolate-path/interpolate-commands.js +0 -108
- package/dist/interpolate-path/path-commands-from-string.d.ts +0 -8
- package/dist/interpolate-path/path-commands-from-string.js +0 -40
- package/dist/interpolate-path.d.ts +0 -8
- package/dist/interpolate-path.js +0 -366
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { CInstruction, Point, ReducedInstruction } from './helpers/types';
|
|
2
|
+
export declare function cutCInstruction({ progress, lastPoint, instruction, }: {
|
|
3
|
+
progress: number;
|
|
4
|
+
lastPoint: Point;
|
|
5
|
+
instruction: CInstruction;
|
|
6
|
+
}): CInstruction;
|
|
7
|
+
export declare const cutInstruction: ({ instruction, lastPoint, progress, }: {
|
|
8
|
+
instruction: ReducedInstruction;
|
|
9
|
+
lastPoint: Point;
|
|
10
|
+
progress: number;
|
|
11
|
+
}) => ReducedInstruction;
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.cutInstruction = exports.cutCInstruction = void 0;
|
|
4
|
+
const cutLInstruction = ({ instruction, lastPoint, progress, }) => {
|
|
5
|
+
const x = lastPoint.x + (instruction.x - lastPoint.x) * progress;
|
|
6
|
+
const y = lastPoint.y + (instruction.y - lastPoint.y) * progress;
|
|
7
|
+
return {
|
|
8
|
+
type: 'L',
|
|
9
|
+
x,
|
|
10
|
+
y,
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
function interpolatePoint(pA, pB, factor) {
|
|
14
|
+
return {
|
|
15
|
+
x: pA.x + (pB.x - pA.x) * factor,
|
|
16
|
+
y: pA.y + (pB.y - pA.y) * factor,
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
function cutCInstruction({ progress, lastPoint, instruction, }) {
|
|
20
|
+
// De Casteljau's algorithm for Bezier splitting
|
|
21
|
+
const u = progress;
|
|
22
|
+
// Points of original curve
|
|
23
|
+
const p0 = { x: lastPoint.x, y: lastPoint.y };
|
|
24
|
+
const p1 = { x: instruction.cp1x, y: instruction.cp1y };
|
|
25
|
+
const p2 = { x: instruction.cp2x, y: instruction.cp2y };
|
|
26
|
+
const p3 = { x: instruction.x, y: instruction.y };
|
|
27
|
+
// First level of interpolation
|
|
28
|
+
const p01 = interpolatePoint(p0, p1, u);
|
|
29
|
+
const p12 = interpolatePoint(p1, p2, u);
|
|
30
|
+
const p23 = interpolatePoint(p2, p3, u);
|
|
31
|
+
// Second level of interpolation
|
|
32
|
+
const p012 = interpolatePoint(p01, p12, u);
|
|
33
|
+
const p123 = interpolatePoint(p12, p23, u);
|
|
34
|
+
// Third level of interpolation (this is the mid-point of the curve at u)
|
|
35
|
+
const p0123 = interpolatePoint(p012, p123, u);
|
|
36
|
+
return {
|
|
37
|
+
type: 'C',
|
|
38
|
+
cp1x: p01.x,
|
|
39
|
+
cp1y: p01.y,
|
|
40
|
+
cp2x: p012.x,
|
|
41
|
+
cp2y: p012.y,
|
|
42
|
+
x: p0123.x,
|
|
43
|
+
y: p0123.y,
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
exports.cutCInstruction = cutCInstruction;
|
|
47
|
+
const cutInstruction = ({ instruction, lastPoint, progress, }) => {
|
|
48
|
+
if (instruction.type === 'M') {
|
|
49
|
+
return instruction;
|
|
50
|
+
}
|
|
51
|
+
if (instruction.type === 'L') {
|
|
52
|
+
return cutLInstruction({ instruction, lastPoint, progress });
|
|
53
|
+
}
|
|
54
|
+
if (instruction.type === 'C') {
|
|
55
|
+
return cutCInstruction({ instruction, lastPoint, progress });
|
|
56
|
+
}
|
|
57
|
+
// TODO: Could we cut it as well?
|
|
58
|
+
if (instruction.type === 'Z') {
|
|
59
|
+
return instruction;
|
|
60
|
+
}
|
|
61
|
+
// @ts-expect-error
|
|
62
|
+
throw new TypeError(`${instruction.type} is not supported.`);
|
|
63
|
+
};
|
|
64
|
+
exports.cutInstruction = cutInstruction;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const cutPath: (d: string, length: number) => string;
|
package/dist/cut-path.js
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.cutPath = void 0;
|
|
4
|
+
const cut_instruction_1 = require("./cut-instruction");
|
|
5
|
+
const reduced_analysis_1 = require("./helpers/reduced-analysis");
|
|
6
|
+
const parse_path_1 = require("./parse-path");
|
|
7
|
+
const reduce_instructions_1 = require("./reduce-instructions");
|
|
8
|
+
const serialize_instructions_1 = require("./serialize-instructions");
|
|
9
|
+
const cutPath = (d, length) => {
|
|
10
|
+
const parsed = (0, parse_path_1.parsePath)(d);
|
|
11
|
+
const reduced = (0, reduce_instructions_1.reduceInstructions)(parsed);
|
|
12
|
+
const constructed = (0, reduced_analysis_1.conductAnalysis)(reduced);
|
|
13
|
+
const newInstructions = [];
|
|
14
|
+
let summedUpLength = 0;
|
|
15
|
+
for (const segment of constructed) {
|
|
16
|
+
for (const instructionAndInfo of segment.instructionsAndInfo) {
|
|
17
|
+
if (summedUpLength + instructionAndInfo.length > length) {
|
|
18
|
+
const remainingLength = length - summedUpLength;
|
|
19
|
+
const progress = remainingLength / instructionAndInfo.length;
|
|
20
|
+
// cut
|
|
21
|
+
const cut = (0, cut_instruction_1.cutInstruction)({
|
|
22
|
+
instruction: instructionAndInfo.instruction,
|
|
23
|
+
lastPoint: instructionAndInfo.startPoint,
|
|
24
|
+
progress,
|
|
25
|
+
});
|
|
26
|
+
newInstructions.push(cut);
|
|
27
|
+
return (0, serialize_instructions_1.serializeInstructions)(newInstructions);
|
|
28
|
+
}
|
|
29
|
+
summedUpLength += instructionAndInfo.length;
|
|
30
|
+
newInstructions.push(instructionAndInfo.instruction);
|
|
31
|
+
if (summedUpLength === length) {
|
|
32
|
+
return (0, serialize_instructions_1.serializeInstructions)(newInstructions);
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
return (0, serialize_instructions_1.serializeInstructions)(newInstructions);
|
|
37
|
+
};
|
|
38
|
+
exports.cutPath = cutPath;
|
package/dist/evolve-path.js
CHANGED
|
@@ -10,6 +10,17 @@ const get_length_1 = require("./get-length");
|
|
|
10
10
|
*/
|
|
11
11
|
const evolvePath = (progress, path) => {
|
|
12
12
|
const length = (0, get_length_1.getLength)(path);
|
|
13
|
+
if (progress === 0) {
|
|
14
|
+
// Because Remotion has not the same rounding as the browser, the length may be a bit too short.
|
|
15
|
+
// This causes a browser artifact https://github.com/remotion-dev/remotion/issues/3960
|
|
16
|
+
// But any line inbetween length and length * 2 will be invisible.
|
|
17
|
+
// So we just select the middle I guess!
|
|
18
|
+
const extendedLength = length * 1.5;
|
|
19
|
+
return {
|
|
20
|
+
strokeDasharray: `${extendedLength} ${extendedLength}`,
|
|
21
|
+
strokeDashoffset: extendedLength,
|
|
22
|
+
};
|
|
23
|
+
}
|
|
13
24
|
const strokeDasharray = `${length} ${length}`;
|
|
14
25
|
const strokeDashoffset = length - progress * length;
|
|
15
26
|
return { strokeDasharray, strokeDashoffset };
|
package/dist/get-bounding-box.js
CHANGED
|
@@ -133,25 +133,6 @@ const getBoundingBoxFromInstructions = (instructions) => {
|
|
|
133
133
|
y = seg.y;
|
|
134
134
|
break;
|
|
135
135
|
}
|
|
136
|
-
case 'Q': {
|
|
137
|
-
const qxMinMax = minmaxQ([x, seg.cpx, seg.x]);
|
|
138
|
-
if (minX > qxMinMax[0]) {
|
|
139
|
-
minX = qxMinMax[0];
|
|
140
|
-
}
|
|
141
|
-
if (maxX < qxMinMax[1]) {
|
|
142
|
-
maxX = qxMinMax[1];
|
|
143
|
-
}
|
|
144
|
-
const qyMinMax = minmaxQ([y, seg.cpy, seg.y]);
|
|
145
|
-
if (minY > qyMinMax[0]) {
|
|
146
|
-
minY = qyMinMax[0];
|
|
147
|
-
}
|
|
148
|
-
if (maxY < qyMinMax[1]) {
|
|
149
|
-
maxY = qyMinMax[1];
|
|
150
|
-
}
|
|
151
|
-
x = seg.x;
|
|
152
|
-
y = seg.y;
|
|
153
|
-
break;
|
|
154
|
-
}
|
|
155
136
|
case 'Z':
|
|
156
137
|
x = lastMoveX;
|
|
157
138
|
y = lastMoveY;
|
|
@@ -179,7 +160,7 @@ exports.getBoundingBoxFromInstructions = getBoundingBoxFromInstructions;
|
|
|
179
160
|
*/
|
|
180
161
|
const getBoundingBox = (d) => {
|
|
181
162
|
const parsed = (0, parse_path_1.parsePath)(d);
|
|
182
|
-
const unarced = (0, remove_a_s_t_curves_1.
|
|
163
|
+
const unarced = (0, remove_a_s_t_curves_1.removeATSHVQInstructions)((0, normalize_path_1.normalizeInstructions)(parsed));
|
|
183
164
|
return (0, exports.getBoundingBoxFromInstructions)(unarced);
|
|
184
165
|
};
|
|
185
166
|
exports.getBoundingBox = getBoundingBox;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.convertQToCInstruction = void 0;
|
|
4
|
+
const convertQToCInstruction = (instruction, startPoint) => {
|
|
5
|
+
const cp1x = startPoint.x + (2 / 3) * (instruction.cpx - startPoint.x);
|
|
6
|
+
const cp1y = startPoint.y + (2 / 3) * (instruction.cpy - startPoint.y);
|
|
7
|
+
const cp2x = instruction.x + (2 / 3) * (instruction.cpx - instruction.x);
|
|
8
|
+
const cp2y = instruction.y + (2 / 3) * (instruction.cpy - instruction.y);
|
|
9
|
+
return {
|
|
10
|
+
type: 'C',
|
|
11
|
+
cp1x,
|
|
12
|
+
cp1y,
|
|
13
|
+
cp2x,
|
|
14
|
+
cp2y,
|
|
15
|
+
x: instruction.x,
|
|
16
|
+
y: instruction.y,
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
exports.convertQToCInstruction = convertQToCInstruction;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import type { AbsoluteInstruction, ReducedInstruction } from './types';
|
|
2
|
-
export declare const iterateOverSegments: <T extends ReducedInstruction>({ segments, iterate, }: {
|
|
3
|
-
segments: AbsoluteInstruction[];
|
|
1
|
+
import type { AbsoluteInstruction, QInstruction, ReducedInstruction } from './types';
|
|
2
|
+
export declare const iterateOverSegments: <T extends QInstruction | ReducedInstruction>({ segments, iterate, }: {
|
|
3
|
+
segments: (AbsoluteInstruction | QInstruction)[];
|
|
4
4
|
iterate: (options: {
|
|
5
|
-
segment: AbsoluteInstruction;
|
|
6
|
-
prevSegment: AbsoluteInstruction | null;
|
|
5
|
+
segment: AbsoluteInstruction | QInstruction;
|
|
6
|
+
prevSegment: (AbsoluteInstruction | QInstruction) | null;
|
|
7
7
|
x: number;
|
|
8
8
|
y: number;
|
|
9
9
|
initialX: number;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { Point, Properties, ReducedInstruction } from './types';
|
|
2
|
+
type SegmentInstruction = {
|
|
3
|
+
function: Properties | null;
|
|
4
|
+
length: number;
|
|
5
|
+
instruction: ReducedInstruction;
|
|
6
|
+
startPoint: Point;
|
|
7
|
+
};
|
|
8
|
+
type Segment = {
|
|
9
|
+
startPoint: Point;
|
|
10
|
+
instructionsAndInfo: SegmentInstruction[];
|
|
11
|
+
};
|
|
12
|
+
export declare const conductAnalysis: (instructions: ReducedInstruction[]) => Segment[];
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.conductAnalysis = void 0;
|
|
4
|
+
const bezier_1 = require("./bezier");
|
|
5
|
+
const linear_1 = require("./linear");
|
|
6
|
+
const conductAnalysis = (instructions) => {
|
|
7
|
+
let currentPoint = { x: 0, y: 0 };
|
|
8
|
+
let moveStart = { x: 0, y: 0 };
|
|
9
|
+
const segments = [];
|
|
10
|
+
for (let i = 0; i < instructions.length; i++) {
|
|
11
|
+
const instruction = instructions[i];
|
|
12
|
+
// moveTo
|
|
13
|
+
if (instruction.type === 'M') {
|
|
14
|
+
currentPoint = { x: instruction.x, y: instruction.y };
|
|
15
|
+
moveStart = { x: currentPoint.x, y: currentPoint.y };
|
|
16
|
+
segments.push({
|
|
17
|
+
startPoint: { x: instruction.x, y: instruction.y },
|
|
18
|
+
instructionsAndInfo: [
|
|
19
|
+
{
|
|
20
|
+
instruction,
|
|
21
|
+
function: null,
|
|
22
|
+
length: 0,
|
|
23
|
+
startPoint: currentPoint,
|
|
24
|
+
},
|
|
25
|
+
],
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
if (instruction.type === 'L') {
|
|
29
|
+
if (segments.length > 0) {
|
|
30
|
+
const length = Math.sqrt((currentPoint.x - instruction.x) ** 2 +
|
|
31
|
+
(currentPoint.y - instruction.y) ** 2);
|
|
32
|
+
segments[segments.length - 1].instructionsAndInfo.push({
|
|
33
|
+
instruction,
|
|
34
|
+
length,
|
|
35
|
+
function: (0, linear_1.makeLinearPosition)({
|
|
36
|
+
x0: currentPoint.x,
|
|
37
|
+
x1: instruction.x,
|
|
38
|
+
y0: currentPoint.y,
|
|
39
|
+
y1: instruction.y,
|
|
40
|
+
}),
|
|
41
|
+
startPoint: currentPoint,
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
currentPoint = { x: instruction.x, y: instruction.y };
|
|
45
|
+
}
|
|
46
|
+
if (instruction.type === 'Z') {
|
|
47
|
+
if (segments.length > 0) {
|
|
48
|
+
const length = Math.sqrt((segments[segments.length - 1].startPoint.x - currentPoint.x) ** 2 +
|
|
49
|
+
(segments[segments.length - 1].startPoint.y - currentPoint.y) ** 2);
|
|
50
|
+
segments[segments.length - 1].instructionsAndInfo.push({
|
|
51
|
+
instruction,
|
|
52
|
+
function: (0, linear_1.makeLinearPosition)({
|
|
53
|
+
x0: currentPoint.x,
|
|
54
|
+
x1: moveStart.x,
|
|
55
|
+
y0: currentPoint.y,
|
|
56
|
+
y1: moveStart.y,
|
|
57
|
+
}),
|
|
58
|
+
length,
|
|
59
|
+
startPoint: { ...currentPoint },
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
currentPoint = { x: moveStart.x, y: moveStart.y };
|
|
63
|
+
}
|
|
64
|
+
if (instruction.type === 'C') {
|
|
65
|
+
const curve = (0, bezier_1.makeCubic)({
|
|
66
|
+
startX: currentPoint.x,
|
|
67
|
+
startY: currentPoint.y,
|
|
68
|
+
cp1x: instruction.cp1x,
|
|
69
|
+
cp1y: instruction.cp1y,
|
|
70
|
+
cp2x: instruction.cp2x,
|
|
71
|
+
cp2y: instruction.cp2y,
|
|
72
|
+
x: instruction.x,
|
|
73
|
+
y: instruction.y,
|
|
74
|
+
});
|
|
75
|
+
const length = curve.getTotalLength();
|
|
76
|
+
if (segments.length > 0) {
|
|
77
|
+
segments[segments.length - 1].instructionsAndInfo.push({
|
|
78
|
+
instruction,
|
|
79
|
+
length,
|
|
80
|
+
function: curve,
|
|
81
|
+
startPoint: { ...currentPoint },
|
|
82
|
+
});
|
|
83
|
+
}
|
|
84
|
+
currentPoint = { x: instruction.x, y: instruction.y };
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
return segments;
|
|
88
|
+
};
|
|
89
|
+
exports.conductAnalysis = conductAnalysis;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import type { AbsoluteInstruction, ReducedInstruction } from './types';
|
|
2
|
-
export declare const
|
|
2
|
+
export declare const removeATSHVQInstructions: (segments: AbsoluteInstruction[]) => ReducedInstruction[];
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.
|
|
3
|
+
exports.removeATSHVQInstructions = void 0;
|
|
4
|
+
const convert_q_to_c_instruction_1 = require("./convert-q-to-c-instruction");
|
|
4
5
|
const iterate_1 = require("./iterate");
|
|
5
6
|
const TAU = Math.PI * 2;
|
|
6
7
|
function approximate_unit_arc(theta1, delta_theta) {
|
|
@@ -157,7 +158,7 @@ function arcToCircle({ x1, y1, x2, y2, largeArcFlag, sweepFlag, rx, ry, phi, })
|
|
|
157
158
|
});
|
|
158
159
|
}
|
|
159
160
|
// Requires path to be normalized
|
|
160
|
-
const
|
|
161
|
+
const removeATSHVQInstructions = (segments) => {
|
|
161
162
|
return (0, iterate_1.iterateOverSegments)({
|
|
162
163
|
segments,
|
|
163
164
|
iterate: ({ segment, prevSegment, x, y, cpX, cpY }) => {
|
|
@@ -223,13 +224,13 @@ const removeATSHVInstructions = (segments) => {
|
|
|
223
224
|
const newControlX = x - vectorX;
|
|
224
225
|
const newControlY = y - vectorY;
|
|
225
226
|
return [
|
|
226
|
-
{
|
|
227
|
+
(0, convert_q_to_c_instruction_1.convertQToCInstruction)({
|
|
227
228
|
type: 'Q',
|
|
228
229
|
cpx: newControlX,
|
|
229
230
|
cpy: newControlY,
|
|
230
231
|
x: segment.x,
|
|
231
232
|
y: segment.y,
|
|
232
|
-
},
|
|
233
|
+
}, { x, y }),
|
|
233
234
|
];
|
|
234
235
|
}
|
|
235
236
|
if (segment.type === 'S') {
|
|
@@ -264,8 +265,11 @@ const removeATSHVInstructions = (segments) => {
|
|
|
264
265
|
},
|
|
265
266
|
];
|
|
266
267
|
}
|
|
268
|
+
if (segment.type === 'Q') {
|
|
269
|
+
return [(0, convert_q_to_c_instruction_1.convertQToCInstruction)(segment, { x, y })];
|
|
270
|
+
}
|
|
267
271
|
return [segment];
|
|
268
272
|
},
|
|
269
273
|
});
|
|
270
274
|
};
|
|
271
|
-
exports.
|
|
275
|
+
exports.removeATSHVQInstructions = removeATSHVQInstructions;
|
package/dist/helpers/types.d.ts
CHANGED
|
@@ -54,8 +54,8 @@ export type QInstruction = {
|
|
|
54
54
|
export type ZInstruction = {
|
|
55
55
|
type: 'Z';
|
|
56
56
|
};
|
|
57
|
-
export type ReducedInstruction = MInstruction | LInstruction | CInstruction |
|
|
58
|
-
export type AbsoluteInstruction = ReducedInstruction | {
|
|
57
|
+
export type ReducedInstruction = MInstruction | LInstruction | CInstruction | ZInstruction;
|
|
58
|
+
export type AbsoluteInstruction = ReducedInstruction | QInstruction | {
|
|
59
59
|
type: 'A';
|
|
60
60
|
rx: number;
|
|
61
61
|
ry: number;
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.PathInternals = exports.warpPath = exports.translatePath = exports.serializeInstructions = exports.scalePath = exports.reversePath = exports.resetPath = exports.reduceInstructions = exports.parsePath = exports.normalizePath = exports.interpolatePath = exports.getTangentAtLength = exports.getSubpaths = exports.getPointAtLength = exports.getLength = exports.getInstructionIndexAtLength = exports.getBoundingBox = exports.extendViewBox = exports.evolvePath = void 0;
|
|
4
|
-
const
|
|
4
|
+
const cut_path_1 = require("./cut-path");
|
|
5
5
|
const debug_path_1 = require("./debug-path");
|
|
6
|
+
const get_bounding_box_1 = require("./get-bounding-box");
|
|
6
7
|
var evolve_path_1 = require("./evolve-path");
|
|
7
8
|
Object.defineProperty(exports, "evolvePath", { enumerable: true, get: function () { return evolve_path_1.evolvePath; } });
|
|
8
9
|
var extend_viewbox_1 = require("./extend-viewbox");
|
|
@@ -42,4 +43,5 @@ Object.defineProperty(exports, "warpPath", { enumerable: true, get: function ()
|
|
|
42
43
|
exports.PathInternals = {
|
|
43
44
|
getBoundingBoxFromInstructions: get_bounding_box_1.getBoundingBoxFromInstructions,
|
|
44
45
|
debugPath: debug_path_1.debugPath,
|
|
46
|
+
cutPath: cut_path_1.cutPath,
|
|
45
47
|
};
|
|
@@ -26,43 +26,8 @@ const convertToCCommand = (command, currentPoint) => {
|
|
|
26
26
|
y: command.y,
|
|
27
27
|
};
|
|
28
28
|
}
|
|
29
|
-
if (command.type === 'Q') {
|
|
30
|
-
return {
|
|
31
|
-
type: 'C',
|
|
32
|
-
cp1x: command.cpx,
|
|
33
|
-
cp1y: command.cpy,
|
|
34
|
-
cp2x: command.cpx,
|
|
35
|
-
cp2y: command.cpy,
|
|
36
|
-
x: command.x,
|
|
37
|
-
y: command.y,
|
|
38
|
-
};
|
|
39
|
-
}
|
|
40
29
|
throw new Error('all types should be handled');
|
|
41
30
|
};
|
|
42
|
-
const convertToQCommand = (command) => {
|
|
43
|
-
if (command.type === 'M' || command.type === 'Q' || command.type === 'Z') {
|
|
44
|
-
throw new Error('unexpected');
|
|
45
|
-
}
|
|
46
|
-
if (command.type === 'C') {
|
|
47
|
-
return {
|
|
48
|
-
type: 'Q',
|
|
49
|
-
cpx: command.cp1x,
|
|
50
|
-
cpy: command.cp1y,
|
|
51
|
-
x: command.x,
|
|
52
|
-
y: command.y,
|
|
53
|
-
};
|
|
54
|
-
}
|
|
55
|
-
if (command.type === 'L') {
|
|
56
|
-
return {
|
|
57
|
-
type: 'Q',
|
|
58
|
-
cpx: command.x,
|
|
59
|
-
cpy: command.y,
|
|
60
|
-
x: command.x,
|
|
61
|
-
y: command.y,
|
|
62
|
-
};
|
|
63
|
-
}
|
|
64
|
-
throw new Error('unhandled');
|
|
65
|
-
};
|
|
66
31
|
/**
|
|
67
32
|
* Converts command A to have the same type as command B.
|
|
68
33
|
*
|
|
@@ -96,9 +61,6 @@ function convertToSameInstructionType(aCommand, bCommand, currentPoint) {
|
|
|
96
61
|
if (bCommand.type === 'L') {
|
|
97
62
|
return convertToLCommand(aCommand);
|
|
98
63
|
}
|
|
99
|
-
if (bCommand.type === 'Q') {
|
|
100
|
-
return convertToQCommand(aCommand);
|
|
101
|
-
}
|
|
102
64
|
if (bCommand.type === 'Z') {
|
|
103
65
|
return {
|
|
104
66
|
type: 'Z',
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import type { CInstruction, LInstruction, MInstruction,
|
|
2
|
-
export declare const interpolateInstructionOfSameKind: (t: number, first: ReducedInstruction, second: ReducedInstruction) => LInstruction | CInstruction | MInstruction |
|
|
1
|
+
import type { CInstruction, LInstruction, MInstruction, ReducedInstruction, ZInstruction } from '../helpers/types';
|
|
2
|
+
export declare const interpolateInstructionOfSameKind: (t: number, first: ReducedInstruction, second: ReducedInstruction) => LInstruction | CInstruction | MInstruction | ZInstruction;
|
|
@@ -19,15 +19,6 @@ const interpolateCInstructions = (t, first, second) => {
|
|
|
19
19
|
y: (1 - t) * first.y + t * second.y,
|
|
20
20
|
};
|
|
21
21
|
};
|
|
22
|
-
const interpolateQInstructions = (t, first, second) => {
|
|
23
|
-
return {
|
|
24
|
-
type: 'Q',
|
|
25
|
-
cpx: (1 - t) * first.cpx + t * second.cpx,
|
|
26
|
-
cpy: (1 - t) * first.cpy + t * second.cpy,
|
|
27
|
-
x: (1 - t) * first.x + t * second.x,
|
|
28
|
-
y: (1 - t) * first.y + t * second.y,
|
|
29
|
-
};
|
|
30
|
-
};
|
|
31
22
|
const interpolateMInstructions = (t, first, second) => {
|
|
32
23
|
return {
|
|
33
24
|
type: 'M',
|
|
@@ -48,12 +39,6 @@ const interpolateInstructionOfSameKind = (t, first, second) => {
|
|
|
48
39
|
}
|
|
49
40
|
return interpolateCInstructions(t, first, second);
|
|
50
41
|
}
|
|
51
|
-
if (first.type === 'Q') {
|
|
52
|
-
if (second.type !== 'Q') {
|
|
53
|
-
throw new Error('mismatch');
|
|
54
|
-
}
|
|
55
|
-
return interpolateQInstructions(t, first, second);
|
|
56
|
-
}
|
|
57
42
|
if (first.type === 'M') {
|
|
58
43
|
if (second.type !== 'M') {
|
|
59
44
|
throw new Error('mismatch');
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.pointsToInstruction = void 0;
|
|
4
|
+
const convert_q_to_c_instruction_1 = require("../helpers/convert-q-to-c-instruction");
|
|
4
5
|
/**
|
|
5
6
|
* Convert segments represented as points back into a command object
|
|
6
7
|
*
|
|
@@ -29,13 +30,16 @@ function pointsToInstruction(points) {
|
|
|
29
30
|
if (points.length === 3) {
|
|
30
31
|
const x1 = points[1][0];
|
|
31
32
|
const y1 = points[1][1];
|
|
32
|
-
return {
|
|
33
|
+
return (0, convert_q_to_c_instruction_1.convertQToCInstruction)({
|
|
33
34
|
type: 'Q',
|
|
34
35
|
cpx: x1,
|
|
35
36
|
cpy: y1,
|
|
36
37
|
x,
|
|
37
38
|
y,
|
|
38
|
-
}
|
|
39
|
+
}, {
|
|
40
|
+
x: points[0][0],
|
|
41
|
+
y: points[0][1],
|
|
42
|
+
});
|
|
39
43
|
}
|
|
40
44
|
return {
|
|
41
45
|
type: 'L',
|
|
@@ -17,9 +17,7 @@ const split_curve_1 = require("./split-curve");
|
|
|
17
17
|
function splitSegmentInstructions(commandStart, commandEnd, segmentCount) {
|
|
18
18
|
let segments = [];
|
|
19
19
|
// line, quadratic bezier, or cubic bezier
|
|
20
|
-
if (commandEnd.type === 'L' ||
|
|
21
|
-
commandEnd.type === 'Q' ||
|
|
22
|
-
commandEnd.type === 'C') {
|
|
20
|
+
if (commandEnd.type === 'L' || commandEnd.type === 'C') {
|
|
23
21
|
if (commandStart.type !== 'Z') {
|
|
24
22
|
segments = segments.concat((0, split_curve_1.splitCurveInstructions)(commandStart.x, commandStart.y, commandEnd, segmentCount));
|
|
25
23
|
}
|
|
@@ -10,6 +10,6 @@ const normalize_path_1 = require("./normalize-path");
|
|
|
10
10
|
*/
|
|
11
11
|
const reduceInstructions = (instruction) => {
|
|
12
12
|
const simplified = (0, normalize_path_1.normalizeInstructions)(instruction);
|
|
13
|
-
return (0, remove_a_s_t_curves_1.
|
|
13
|
+
return (0, remove_a_s_t_curves_1.removeATSHVQInstructions)(simplified);
|
|
14
14
|
};
|
|
15
15
|
exports.reduceInstructions = reduceInstructions;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.fixZInstruction = exports.warpTransform = exports.svgPathInterpolate = void 0;
|
|
4
|
+
const convert_q_to_c_instruction_1 = require("../helpers/convert-q-to-c-instruction");
|
|
4
5
|
const euclideanDistance = (points) => {
|
|
5
6
|
const startPoint = points[0];
|
|
6
7
|
const endPoint = points[points.length - 1];
|
|
@@ -65,13 +66,16 @@ function createLineSegment(points) {
|
|
|
65
66
|
y: points[1][1],
|
|
66
67
|
};
|
|
67
68
|
case 3:
|
|
68
|
-
return {
|
|
69
|
+
return (0, convert_q_to_c_instruction_1.convertQToCInstruction)({
|
|
69
70
|
type: 'Q',
|
|
70
71
|
cpx: points[1][0],
|
|
71
72
|
cpy: points[1][1],
|
|
72
73
|
x: points[2][0],
|
|
73
74
|
y: points[2][1],
|
|
74
|
-
}
|
|
75
|
+
}, {
|
|
76
|
+
x: points[0][0],
|
|
77
|
+
y: points[0][1],
|
|
78
|
+
});
|
|
75
79
|
case 4:
|
|
76
80
|
return {
|
|
77
81
|
type: 'C',
|
|
@@ -104,13 +108,7 @@ function warpInterpolate(path, threshold, deltaFunction) {
|
|
|
104
108
|
if (segment.type === 'L') {
|
|
105
109
|
points.push([segment.x, segment.y]);
|
|
106
110
|
}
|
|
107
|
-
if (segment.type === '
|
|
108
|
-
points.push([segment.cpx, segment.cpy]);
|
|
109
|
-
points.push([segment.x, segment.y]);
|
|
110
|
-
}
|
|
111
|
-
if (segment.type === 'C' ||
|
|
112
|
-
segment.type === 'Q' ||
|
|
113
|
-
segment.type === 'L') {
|
|
111
|
+
if (segment.type === 'C' || segment.type === 'L') {
|
|
114
112
|
return interpolateUntil(points, threshold, deltaFunction).map((rawSegment) => createLineSegment(rawSegment));
|
|
115
113
|
}
|
|
116
114
|
return [segment];
|
|
@@ -144,22 +142,6 @@ const warpTransform = (path, transformer) => {
|
|
|
144
142
|
},
|
|
145
143
|
];
|
|
146
144
|
}
|
|
147
|
-
if (segment.type === 'Q') {
|
|
148
|
-
const { x, y } = transformer({ x: segment.x, y: segment.y });
|
|
149
|
-
const { x: cpx, y: cpy } = transformer({
|
|
150
|
-
x: segment.cpx,
|
|
151
|
-
y: segment.cpy,
|
|
152
|
-
});
|
|
153
|
-
return [
|
|
154
|
-
{
|
|
155
|
-
type: 'Q',
|
|
156
|
-
x,
|
|
157
|
-
y,
|
|
158
|
-
cpx,
|
|
159
|
-
cpy,
|
|
160
|
-
},
|
|
161
|
-
];
|
|
162
|
-
}
|
|
163
145
|
if (segment.type === 'C') {
|
|
164
146
|
const { x, y } = transformer({ x: segment.x, y: segment.y });
|
|
165
147
|
const { x: cp1x, y: cp1y } = transformer({
|
package/package.json
CHANGED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* List of params for each command type in a path `d` attribute
|
|
3
|
-
*/
|
|
4
|
-
export declare const typeMap: {
|
|
5
|
-
M: string[];
|
|
6
|
-
L: string[];
|
|
7
|
-
H: string[];
|
|
8
|
-
V: string[];
|
|
9
|
-
C: string[];
|
|
10
|
-
S: string[];
|
|
11
|
-
Q: string[];
|
|
12
|
-
T: string[];
|
|
13
|
-
A: string[];
|
|
14
|
-
Z: never[];
|
|
15
|
-
m: string[];
|
|
16
|
-
l: string[];
|
|
17
|
-
h: string[];
|
|
18
|
-
v: string[];
|
|
19
|
-
c: string[];
|
|
20
|
-
s: string[];
|
|
21
|
-
q: string[];
|
|
22
|
-
t: string[];
|
|
23
|
-
a: string[];
|
|
24
|
-
z: never[];
|
|
25
|
-
};
|
|
26
|
-
export type Command = {
|
|
27
|
-
x2?: number | undefined;
|
|
28
|
-
y2?: number | undefined;
|
|
29
|
-
x1?: number | undefined;
|
|
30
|
-
y1?: number | undefined;
|
|
31
|
-
x?: number;
|
|
32
|
-
y?: number;
|
|
33
|
-
xAxisRotate?: number;
|
|
34
|
-
largeArcFlag?: boolean;
|
|
35
|
-
sweepFlag?: boolean;
|
|
36
|
-
type: keyof typeof typeMap;
|
|
37
|
-
};
|
|
38
|
-
/**
|
|
39
|
-
* Convert command objects to arrays of points, run de Casteljau's algorithm on it
|
|
40
|
-
* to split into to the desired number of segments.
|
|
41
|
-
*
|
|
42
|
-
* @param {Object} commandStart The start command object
|
|
43
|
-
* @param {Object} commandEnd The end command object
|
|
44
|
-
* @param {Number} segmentCount The number of segments to create
|
|
45
|
-
* @return {Object[]} An array of commands representing the segments in sequence
|
|
46
|
-
*/
|
|
47
|
-
export declare const splitCurve: (commandStart: Command, commandEnd: Command, segmentCount: number) => Command[];
|