@vue-flow/monorepo • Docs

---

Function: getStraightPath()

getStraightPath(__namedParameters): [string, number, number, number, number]

Get a straight path from source to target handle

Parameters

• __namedParameters: GetStraightPathParams

Returns

[string, number, number, number, number]

A path string you can use in an SVG, the labelX and labelY position (center of path) and offsetX, offsetY between source handle and label

Example

const source = { x: 0, y: 20 };
   const target = { x: 150, y: 100 };
   
   const [path, labelX, labelY, offsetX, offsetY] = getStraightPath({
     sourceX: source.x,
     sourceY: source.y,
     sourcePosition: Position.Right,
     targetX: target.x,
     targetY: target.y,
     targetPosition: Position.Left,
   });