<ViewportPortal />
<ViewportPortal />
组件可以用于向 flow 的同一视窗添加组件,节点和边在其中渲染。当您想要渲染自己的组件时,这很有用,这些组件与节点和边的坐标系保持一致,并且还受缩放和平移的影响
import React from 'react';
import { ViewportPortal } from '@xyflow/react';
export default function () {
return (
<ViewportPortal>
<div
style={{ transform: 'translate(100px, 100px)', position: 'absolute' }}
>
This div is positioned at [100, 100] on the flow.
</div>
</ViewportPortal>
);
}