Back to Remotion

getTangentAtLength()

packages/docs/docs/paths/get-tangent-at-length.mdx

4.0.4601.1 KB
Original Source

Part of the @remotion/paths package.

Gets tangent values x and y of a point which is on an SVG path. The first argument is an SVG path, the second one is the length at which the point should be sampled. It must be between 0 and the return value of getLength().

Returns a point if the path is valid:

tsx
import { getTangentAtLength } from "@remotion/paths";

const tangent = getTangentAtLength("M 50 50 L 150 50", 50);
console.log(tangent); // { x: 1, y: 0}

The function will throw if the path is invalid:

tsx
import { getTangentAtLength } from "@remotion/paths";
// ---cut---
getTangentAtLength("remotion", 50); // Error: Malformed path data: ...

Credits

Source code stems mostly from svg-path-properties.

See also