parsePath()
Part of the @remotion/paths package. Available from v3.3.40
Parses an SVG string path into an array of Instruction's.
import { parsePath } from "@remotion/paths";
const newPath = parsePath ("M 10 10 L 20 20");
/*
[
{ type: "M", x: 10, y: 10 },
{ type: "L", x: 20, y: 20 },
]
*/This function will throw if the SVG path is invalid.
Return type type
An array of Instruction's. The Instruction type can also be imported from @remotion/paths:
import type { Instruction } from "@remotion/paths";The type has the following shape:
export type Instruction =
| {
type : "M";
x : number;
y : number;
}
| {
type : "L";
x : number;
y : number;
}
| {
type : "H";
x : number;
}
| {
type : "V";
y : number;
}
| {
type : "C";
cp1x : number;
cp1y : number;
cp2x : number;
cp2y : number;
x : number;
y : number;
}
| {
type : "S";
cpx : number;
cpy : number;
x : number;
y : number;
}
| {
type : "Q";
cpx : number;
cpy : number;
x : number;
y : number;
}
| {
type : "T";
x : number;
y : number;
}
| {
type : "A";
rx : number;
ry : number;
xAxisRotation : number;
largeArcFlag : boolean;
sweepFlag : boolean;
x : number;
y : number;
}
| {
type : "m";
dx : number;
dy : number;
}
| {
type : "l";
dx : number;
dy : number;
}
| {
type : "h";
dx : number;
}
| {
type : "v";
dy : number;
}
| {
type : "c";
cp1dx : number;
cp1dy : number;
cp2dx : number;
cp2dy : number;
dx : number;
dy : number;
}
| {
type : "s";
cpdx : number;
cpdy : number;
dx : number;
dy : number;
}
| {
type : "q";
cpdx : number;
cpdy : number;
dx : number;
dy : number;
}
| {
type : "t";
dx : number;
dy : number;
}
| {
type : "a";
rx : number;
ry : number;
xAxisRotation : number;
largeArcFlag : boolean;
sweepFlag : boolean;
dx : number;
dy : number;
}
| {
type : "Z";
}
| {
type : "z";
};