getSimpleBezierPath()

该 getSimpleBezierPath 工具返回了渲染两个节点之间简单贝塞尔曲线边所需的全部内容。

import { Position, getSimpleBezierPath } from '@xyflow/svelte';
 
const source = { x: 0, y: 20 };
const target = { x: 150, y: 100 };
 
const [path, labelX, labelY, offsetX, offsetY] = getSimpleBezierPath({
  sourceX: source.x,
  sourceY: source.y,
  sourcePosition: Position.Right,
  targetX: target.x,
  targetY: target.y,
  targetPosition: Position.Left,
});
 
console.log(path); //=> "M0,20 C75,20 75,100 150,100"
console.log(labelX, labelY); //=> 75, 60
console.log(offsetX, offsetY); //=> 75, 40

签名

名称	类型	默认值
#参数
#`params`	`object`
#`params.sourceX`	`number`
#`params.sourceY`	`number`
#`params.sourcePosition?`	`Position`	`Position.Bottom`
#`params.targetX`	`number`
#`params.targetY`	`number`
#`params.targetPosition?`	`Position`	`Position.Top`
#返回值
#`[0]`	`string` 在 SVG <path> 元素中使用的路径。
#`[1]`	`number` 用于渲染此边标签的 x 坐标。
#`[2]`	`number` 用于渲染此边标签的 y 坐标。
#`[3]`	`number` 源 x 坐标与该路径中点的 x 坐标之间的绝对差。
#`[4]`	`number` 源 y 坐标与该路径中点的 y 坐标之间的绝对差。

说明

该函数返回一个元组（即固定大小的数组），以便更轻松地同时处理多个边路径。

类型