Excalidraw Diagram Generator

✏️ 手绘风格图表一键生成

dev-tools榜 #24

将 Excalidraw JSON 实时渲染为手绘风格 PNG 图表,支持流程图、架构图,自动计算箭头绑定,无需手动坐标计算

收藏
26.7k
安装
6.1k
版本
1.0.0
CLS 安全扫描中
预计需要 3 分钟...

使用说明

核心用法

Excalidraw Diagram Generator 是一个将结构化 JSON 数据转换为手绘风格 PNG 图像的工具,专用于生成流程图、架构图和示意图。用户通过编写符合 Excalidraw 规范的元素数组(包含矩形、椭圆、菱形、箭头、文本等基础图形),保存为 .excalidraw 文件后,调用内置的 Node.js 渲染脚本生成最终图像。

显著优点

1. 智能箭头绑定系统:最核心的设计亮点是 from/to 绑定机制。用户无需手动计算图形边缘的精确坐标,渲染器会自动计算起点和终点的边缘交点,大幅降低绘图复杂度。

2. 真实手绘质感:通过 roughness 参数(0-2 级)控制线条的手绘程度,配合 hachure 填充样式,生成具有纸质草图质感的专业图表,比传统矢量图更具亲和力。

3. 灵活的路径路由:支持 absolutePoints 多段箭头,可指定中间路径点实现绕开障碍物的复杂连线,兼顾自动化与精细化控制。

4. 零依赖渲染:仅需 Node.js 环境即可运行,不依赖浏览器或外部服务,适合自动化流水线集成。

潜在局限

  • 学习门槛:需要理解 Excalidraw 的 JSON Schema,对非技术用户不够友好
  • 交互缺失:纯生成工具,不支持实时拖拽编辑,修改需重新生成 JSON
  • 样式受限:仅支持预设的几何图形和基础样式,复杂自定义图形能力有限
  • 文本定位:文本元素需手动计算坐标嵌入图形内,无自动居中功能

适合人群

  • 需要快速生成示意图的开发者、技术写作者
  • 追求手绘风格但不愿使用复杂设计软件的用户
  • 希望将图表生成集成到自动化文档工作流的团队

常规风险

  • JSON 语法错误会导致渲染失败,需确保 ID 唯一性
  • 手动坐标计算错误可能导致文本与图形错位
  • 未使用 from/to 绑定时,箭头可能无法正确连接图形边缘

Excalidraw Diagram Generator 内容

暂无文件树

手动下载zip · 20.1 kB
contentapplication/octet-stream
请选择文件