xyflow
xyflow.com又名 xyflow、React Flow、Svelte Flow
柏林 webkid GmbH 维护的开源节点式界面库,分 React Flow 和 Svelte Flow 两版,适合写 React 或 Svelte 的前端开发者搭低代码编排、流程配置这类连来连去的界面。
工具网页英文开源

xyflow 是柏林一个小团队维护的开源项目,专做「节点式界面」:画布上放方块,用线把它们连起来,拖动、缩放、增删节点都在浏览器里完成。它拆成两个库,React Flow 给 React 项目用,Svelte Flow 给 Svelte 项目用,都是可定制的组件,装进项目里就能搭出节点编辑器或交互式图表。
主要功能
两个库提供的是同一套能力:节点拖拽、连线、画布平移缩放,以及自定义节点外观和连线样式。官方说开箱即用,也能一直改到贴合自己的产品。页面上列出的实际用途包括数据处理工具、聊天机器人搭建器、机器学习流程、音乐合成器,Stripe 的文档流程图和 Typeform 的问卷逻辑可视化也在其中。
适合谁
面向写 React 或 Svelte 的前端开发者。如果你要做的是低代码编排、流程配置、思维导图、数据管道这类「连来连去」的界面,它省掉自己从零写画布和连线的功夫。不写代码的人用不上它,它本身不是可以直接打开来画图的成品工具。
费用与限制
库是开源的,页面底部另有一项 Pro License 的入口,具体条款和价格页面上没写。界面为英文,团队自 2019 年起维护,社区入口在 Discord 和 GitHub。用之前需要熟悉对应框架,节点逻辑、数据结构和样式都得自己接。
常见问题
xyflow 有哪些平台 / App?
支持 网页。
xyflow 的替代品有哪些?
本站整理了 7 个替代品,例如 AntV、VisActor、PlayCanvas、React Flow。
替代品 全部 7 个 →
A
AntV
蚂蚁集团的数据可视化解决方案,由 G2、G6、L7、S2 等引擎分别负责统计图表、关系图、地理空间数据和多维表格,并提供开箱可用的 Ant Design Charts 组件,适合前端开发者在网页或小程序里按场景嵌入定制图表。替代关系图/流程图这一块:G6 可做节点连线图,但非 React 组件式低代码画布
VisActor
字节跳动开源的可视化开发方案,以 VChart 画多系列组合图、VTable 做交互式表格,另含渲染引擎、可视化语法与 GIS 等模块,适合前端工程师搭建数据大屏和 BI 看板。替代可视化渲染这一块:提供图表与渲染引擎,但无现成节点拖拽连线组件
PlayCanvas
跑在浏览器里的实时 3D 创作平台,由开源引擎和云端协作编辑器组成,支持 WebGL2 与 WebGPU,适合做网页游戏、产品配置器和 AR/VR 体验的开发者多人协作改同一个场景。替代画布交互这一块:浏览器内可拖拽编辑,但面向 3D 场景而非节点流程图
React Flow
用 React 编写的节点式界面组件库,由 xyflow 维护,内置拖拽、缩放平移、框选和连线,节点本身是普通 React 组件,另配小地图、缩放控件和节点工具栏,适合会写 React 的前端开发者搭工作流编辑器或无代码应用底座。xyflow 的 React 版本本体,换名不换库,节点连线能力完全一致