JointJS如何深入解析JavaScript流程图绘制框架？

本文共计2526个文字，预计阅读时间需要11分钟。

JointJS：基于JavaScript的流程图绘制框架，研究了多种绘制流程图的js框架，最终选择了Joint。配合dagre，可以绘制出类似仿真的流程图。JointJS简介：JointJS是一个开源的前端框架，支持绘制各种类型的流程图。

JointJS：JavaScript 流程图绘制框架

最近调研了js画流程图的框架，最后选择了Joint。配合上 dagre 可以画出像模像样的流程图。

JointJS 简介

JointJS 是一个开源前端框架，支持绘制各种各样的流程图、工作流图等。Rappid 是 Joint 的商业版，提供了一些更强的插件。JointJS 的特点有下面几条，摘自官网：

• 能够实时地渲染上百（或者上千）个元素和连接
• 支持多种形状（矩形、圆、文本、图像、路径等）
• 高度事件驱动，用户可自定义任何发生在 paper 下的事件响应
• 元素间连接简单
• 可定制的连接和关系图
• 连接平滑（基于贝塞尔插值 bezier interpolation）& 智能路径选择
• 基于 SVG 的可定制、可编程的图形渲染
• NodeJS 支持
• 通过 JSON 进行序列化和反序列化

总之 JoingJS 是一款很强的流程图制作框架，开源版本已经足够日常使用了。