源码介绍
Drawnix 是一个基于 Web 的开源白板工具(SaaS 模式)，旨在提供一个集思维导图、流程图绘制、自由绘图等多种功能于一体的可视化协作平台。该项目采用现代化前端架构构建，支持多种 UI 框架(如 React、Angular)，并具备良好的扩展性与可维护性。
项目结构概览：
drawnix/ ├── apps/ │ └── web # 前端应用入口 │ └── index.html ├── dist/ # 构建输出目录 ├── packages/ │ └── drawnix/ │ ├── react-board/ # React 白板视图层 │ └── react-text/ # 文本渲染模块 ├── package.json └── README.md
该项目底层依赖于Plait 框架，这是一个由团队自主研发并开源的图形绘制框架，代表了公司在知识图谱与可视化产品上的技术积累。Drawnix 基于 Plait 构建，实现了高度模块化和插件化的设计。
源码功能
1. 多种绘图模式支持
思维导图(Mind Mapping)：支持 Markdown 语法快速生成思维导图，便于知识整理与逻辑构建。
流程图(Flowchart)：支持 Mermaid 语法自动转换为流程图，适合技术文档与流程设计。
自由画布(Free Drawing)：支持自由绘图、插入图片、使用画笔等，满足创意表达需求。
2. 强大的编辑能力
支持撤销(Undo)、重做(Redo)、复制、粘贴等基础编辑操作。
支持多图层管理、对象拖拽、缩放与旋转。
3. 数据导出与自动保存
支持导出为 PNG 图片格式和 JSON 格式(.drawnix文件)，便于后期编辑与分享。
浏览器本地自动保存功能，防止数据丢失。
4. 交互与适配优化
无限画布：支持无限缩放与滚动，适应大型项目与复杂图表。
响应式设计：适配移动端设备，支持触控操作。
主题模式：支持亮/暗色主题切换，提升用户体验。
5. 插件机制与扩展能力
基于插件架构，支持不同 UI 框架(React、Angular)和富文本框架(如 Slate)。
支持开发细粒度可复用插件，拓展应用场景(如集成第三方工具、AI辅助绘图等)。
源码特色
Drawnix 不仅功能全面，其背后的技术架构与设计理念也极具优势，以下是其核心特色：
1. 开源免费 + MIT 协议
项目完全开源，采用 MIT 协议，允许自由使用、修改与分发。
适合企业、教育机构及个人开发者进行二次开发或私有化部署。
2. 插件化架构设计
基于 Plait 框架构建，采用模块化设计，便于功能扩展与维护。
支持多 UI 框架集成，适应不同前端技术栈需求。
3. 技术栈现代且成熟
核心依赖包括：
Plait：图形绘制引擎
Slate.js：富文本编辑框架
Floating UI：弹出层组件库
技术生态稳定，社区活跃，文档完善。
4. 高度可定制化
支持自定义插件开发，可扩展功能包括：
自定义图形组件
AI 辅助绘图插件
第三方数据导入导出
多语言支持等
5. 跨平台部署支持
支持通过 npm 安装运行：
npm install npm run start
支持 Docker 部署：
docker pull pubuzhixing/drawnix:latest
总结
Drawnix 是一款集功能性、扩展性与开源精神于一体的在线白板工具，其背后的技术架构与设计理念体现了现代前端开发的先进方向。无论你是需要一个轻量级的绘图工具，还是希望基于其源码进行深度定制与二次开发，Drawnix 都是一个值得尝试的优秀项目。
源码截图
