产品名称：jsplumb

生产厂商：jsplumb产品类别：设计制作

JsPlumb 是一个 JavaScript 库，帮助您快速创建包含可视化连接功能的复杂应用程序，而无需编写那些枯燥的基础功能。可视化连接功能包括：平移/缩放、缩略图小部件、自动布局、数据绑定、路径查找等等。

JsPlumb 与主流框架/库（例如 Angular、React、Vue 和 Svelte）深度集成。JsPlumb 帮助您快速构建以图表和可视化连接为核心的强大应用程序。

什么是流程图？

流程图是一种表示工作流程或过程的图表，因此该术语的含义非常广泛。它本质上是代表某种算法的图表。

流程图由一组通过边连接的块组成。某些流程图中的块可以代表各种各样的概念。jsPlumb 工具包附带了一组流程图形状，这些形状代表了人们想要使用的许多常见概念 - 例如流程、问题、决策、输入、输出等。

产品特征

jsPlumb 工具包提供了一组软件包，可帮助您快速构建功能强大的应用程序，其重点是图表和可视化连接。该工具包的一些主要功能包括：

l  用于定义 UI 各个部分的外观和行为的强大声明机制。

l  通过客户端模板进行数据绑定，支持连接的声明性配置。

l  底层有向图，允许您以多种方式查询数据。

l  平移/缩放小部件，能够将其状态（手动或自动）序列化到本地存储或 cookie。

l  一个迷你视图小部件，可帮助导航大型数据集。

l  自动布局（层次结构、力导向、圆形、气球、绝对），以及编写您自己的布局的能力。

l  数据加载/保存自动或按需。

l Angular 集成与 Angular 深度集成。支持 2 - 16 的所有版本。

l React 集成支持 React 16+ 和 NextJS。

l Vue 2 集成。

l Vue 3 集成，包括组合 API。

l Svelte 3 集成。

如何进行这个演示？

单击一条边将其置于编辑模式，然后拖动路径段进行更改

将新节点从调色板拖到画布上

单击一个节点将其放入调整大小节点，然后拖动角上的手柄以更改其尺寸

单击“导出...”导出为 SVG/PNG/JPG

单击铅笔图标进入选择模式，选择几个节点，然后按“导出...”仅导出您选择的节点（以及源和目标在选择中的任何边）