parsePath()

属于 @remotion/paths 包。从 v3.3.40 起可用

🌐 Part of the @remotion/paths package. Available from v3.3.40

将 SVG 字符串路径解析为 Instruction 数组。

🌐 Parses an SVG string path into an array of Instruction's.

reset-path.ts
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 },
  ]
*/

如果 SVG 路径无效，此函数将抛出异常。

🌐 This function will throw if the SVG path is invalid.

返回类型类型

🌐 Return type type

一个 Instruction 的数组。Instruction 类型也可以从 @remotion/paths 导入：

🌐 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";
    };

另请参阅

🌐 See also

返回类型类型​

另请参阅​

返回类型类型

另请参阅