Skip to content

设计思路

整体和 Prosemirror 类似,尽可能的抽象成一个 MVC 架构出来

uml diagram

核心模块

核心模块作为 packages 进行提供

  • @ymindmap/model 它被用来简明的描述文档内容
  • @ymindmap/stateYjs 的一个封装,用来提供一些快捷操作数据的方式(开发中)
  • @ymindmap/viewLeafer.js 的一个封装,同时也是 沟通视图层和数据层的一个桥梁,通过遍历 state 层将 YjsXml 转为 model 的一个个 NodeLeafer.js 的显示元素
  • @ymindmap/core 核心库,提供了 指令,插件,数据源转换等工作,对外会输出提供一个 Board 画板
  • @ymindmap/browserLeafer.js提供了在浏览器下的一些能力封装和补全,包括编辑器系统,容器封装等功能

核心插件

核心模块作为 extensions 进行提供

因为Ymindmap是基于Yjs进行开发的,所以在设计上需要考虑到数据的同步问题,同时也要考虑到插件系统的扩展性,所以核心模块作为 extensions 进行提供。

目前主要通过以下几个插件提供了一个思维导图系统

相关核心插件会通过startkits暴露出的入口文件,自动进行注入

核心流程

uml diagram

整体架构

以在浏览器端为例,实际上Node.js的话,只是不用引入Browser罢了

uml diagram