Drawnix开源在线白板工具源码 可视化协作SaaS平台
Drawnix是一款基于Web的开源白板工具，采用SaaS模式打造，是集思维导图绘制、流程图设计、自由创意绘图等多种功能于一体的可视化协作平台。项目采用现代化前端架构构建，原生兼容React、Angular等主流UI框架，具备极强的扩展性与可维护性。
项目技术底层与结构概览
底层核心框架
项目底层基于自主研发并开源的Plait图形绘制框架构建，沉淀了专业的知识图谱与可视化产品技术积累，实现了高度模块化、插件化的核心设计，为功能扩展与二次开发提供了坚实的技术底座。
项目核心结构
drawnix/
├── apps/
│ └── web # 前端应用入口
│ └── index.html
├── dist/ # 构建输出目录
├── packages/
│ └── drawnix/
│ ├── react-board/ # React 白板视图层
│ └── react-text/ # 文本渲染模块
├── package.json
└── README.md核心功能模块
1. 全场景绘图模式支持
- 思维导图：原生支持Markdown语法快速生成思维导图，适配知识整理、逻辑梳理、框架搭建等全场景需求
- 流程图：支持Mermaid语法一键自动转换为标准流程图，完美适配技术文档撰写、业务流程设计等专业场景
- 自由画布：提供无限制自由绘图能力，支持画笔手绘、图片插入等创意操作，满足各类个性化创意表达需求
2. 专业级编辑能力
完整覆盖基础编辑全操作，支持撤销(Undo)、重做(Redo)、复制、粘贴等核心操作；同时提供多图层精细化管理能力，支持画布内对象的自由拖拽、缩放与旋转，满足复杂图表的精细化编辑需求。
3. 数据安全与导出能力
- 多格式导出：支持将画布内容导出为PNG图片格式，以及专属JSON格式（.drawnix文件），兼顾分享传播与后期二次编辑需求
- 自动保存：内置浏览器本地自动保存机制，实时备份画布内容，有效防止意外操作导致的数据丢失
4. 极致交互与多端适配优化
- 无限画布：支持画布无限缩放与滚动，无边界创作空间，完美适配大型项目设计、复杂知识图谱搭建等大体积内容创作
- 响应式设计：全页面响应式适配，完美兼容移动端设备，原生支持触控操作，实现多端无缝创作体验
- 主题模式：内置亮色/暗色双主题切换能力，适配不同使用环境与视觉偏好，大幅提升长时间使用的用户体验
5. 灵活插件机制与扩展能力
基于插件化架构设计，原生兼容React、Angular等不同UI框架，以及Slate等主流富文本框架；支持开发者开发细粒度可复用插件，可无限拓展应用场景，包括但不限于集成第三方工具、AI辅助绘图、行业专属功能模块等。
源码核心特色
1. 完全开源，MIT协议授权
项目全程开源免费，采用宽松的MIT开源协议，允许所有用户自由使用、修改与分发源码，无论是企业商用、教育机构教学使用，还是个人开发者学习、二次开发、私有化部署，均无版权限制。
2. 插件化模块化架构设计
基于Plait图形绘制框架构建，全程采用模块化、插件化设计理念，功能模块解耦彻底，既便于日常维护与问题排查，也大幅降低了功能扩展的开发门槛，可灵活适配不同前端技术栈的集成需求。
3. 现代化成熟技术栈
项目核心技术依赖稳定成熟，生态完善，具体包括：
- Plait：自研专业图形绘制引擎
- Slate.js：主流富文本编辑框架
- Floating UI：轻量化弹出层组件库
技术栈社区活跃，开发文档完善，学习与二次开发门槛低，适配现代前端开发标准。
4. 超高自由度可定制化
原生支持自定义插件开发，可根据业务需求灵活拓展各类能力，包括自定义图形组件、AI辅助绘图插件、第三方数据格式导入导出、多语言国际化支持等，可深度定制为行业专属白板工具。
5. 多方式跨平台部署支持
提供两种便捷部署方式，适配不同使用场景与技术环境：
npm本地安装运行：
npm install npm run startDocker容器化部署：
docker pull pubuzhixing/drawnix:latest
项目总结
Drawnix是一款集全场景绘图能力、极致扩展性与开源精神于一体的专业在线白板工具，其底层技术架构与插件化设计理念，完全贴合现代前端开发的先进方向。无论是个人用户需要一款轻量级、无版权限制的在线绘图工具，还是企业、开发者希望基于源码进行深度定制、二次开发，打造专属的可视化协作平台，Drawnix都是兼具实用性与拓展性的优质开源项目。
