react-flow-renderer有提供获取曲线的中心点吗

`react-flow-renderer` 库本身没有提供获取曲线中心点的方法，但是您可以使用 `getPointAtLength()` 方法来获取贝塞尔曲线上的点，并计算这些点的平均值来得到贝塞尔曲线的中心点。具体来说，您可以按照以下步骤进行操作： 1. 在 `Edge` 组件中，使用 `getBezierPath` 方法获取线的路径。例如： ```jsx import React from 'react'; import { Edge } from 'react-flow-renderer'; const MyEdge = ({ id, sourceX, sourceY, targetX, targetY }) => { const path = getBezierPath({ sourceX, sourceY, targetX, targetY }); return ( ); }; export default MyEdge; ``` 2. 使用 `path` 属性中的路径信息计算线的中心位置。具体来说，您可以使用以下公式计算贝塞尔曲线的中心点： ```jsx import React, { useMemo } from 'react'; import { Edge } from 'react-flow-renderer'; const MyEdge = ({ id, sourceX, sourceY, targetX, targetY }) => { const path = useMemo(() => getBezierPath({ sourceX, sourceY, targetX, targetY }), [sourceX, sourceY, targetX, targetY]); const [cx, cy] = useMemo(() => { const p = new Path2D(path); const length = p.getTotalLength(); let x = 0; let y = 0; for (let i = 0; i <= length; i += length / 10) { const { x: px, y: py } = p.getPointAtLength(i); x += px; y += py; } return [x / 11, y / 11]; }, [path]); return ( <>  收藏(0)  分享