支持直接双击文件打开应用进入编辑

修改打包配置
打包
2026-02-17 22:08:25 +08:00 · 2023-05-05 17:37:01 +08:00 · 2023-05-05 16:59:39 +08:00 · 2023-05-05 16:04:15 +08:00 · 2023-05-05 14:55:01 +08:00 · 2023-05-05 10:51:39 +08:00
496 changed files with 15430 additions and 18266 deletions
--- a/21
+++ b/21
@@ -1,21 +0,0 @@
-The MIT License (MIT)
-
-Copyright (c) 2021-2023 The MindMap Team
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
--- a/README.md
+++ b/README.md
@@ -19,12 +19,6 @@

 在线地址：[https://wanglin2.github.io/mind-map/](https://wanglin2.github.io/mind-map/)

-另外也提供了客户端可供下载使用，支持`Windows`、`Mac`及`Linux`，下载地址：
-
-Github：[releases](https://github.com/wanglin2/mind-map/releases)。
-
-百度云盘：[地址](https://pan.baidu.com/s/1huasEbKsGNH2Af68dvWiOg?pwd=3bp3)。
-
 # 特性

 - [x] 插件化架构，除核心功能外，其他功能作为插件提供，按需使用，减小打包体积
@@ -86,70 +80,8 @@ const mindMap = new MindMap({

 # License

-[MIT](./LICENSE)
+MIT

 # 微信交流群

-<img src="./qrcode.jpg" style="width: 300px" />
-
-如果已过期，可以微信添加`wanglinguanfang`拉你入群。
-
-# 请作者喝杯咖啡
-
-开源不易，如果本项目有帮助到你的话，可以考虑请作者喝杯咖啡哟~
-
-> 厚椰乳一盒 + 纯牛奶半盒 + 冰块 + 咖啡液 = 生椰拿铁 yyds
-
-> 转账请备注【思维导图】。你的头像和名字将会出现在下面和[文档页面](https://wanglin2.github.io/mind-map/#/doc/zh/introduction/%E8%AF%B7%E4%BD%9C%E8%80%85%E5%96%9D%E6%9D%AF%E5%92%96%E5%95%A1)
-
-<p>
-  <img src="./web/src/assets/img/alipay.jpg" style="width: 300px" />
-  <img src="./web/src/assets/img/wechat.jpg" style="width: 300px" />
-</p>
-
-<p>
-    <span>
-        <img src="./web/src/assets/avatar/Think.jpg" style="width: 50px;height: 50px;" />
-        <span>Think</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/志斌.jpg" style="width: 50px;height: 50px;" />
-        <span>志斌</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/小土渣的宇宙.jpeg" style="width: 50px;height: 50px;" />
-        <span>小土渣的宇宙</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/qp.jpg" style="width: 50px;height: 50px;" />
-        <span>qp</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/ZXR.jpg" style="width: 50px;height: 50px;" />
-        <span>ZXR</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/花儿朵朵.jpg" style="width: 50px;height: 50px;" />
-        <span>花儿朵朵</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/suka.jpg" style="width: 50px;height: 50px;" />
-        <span>suka</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/Chris.jpg" style="width: 50px;height: 50px;" />
-        <span>Chris</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/水车.jpg" style="width: 50px;height: 50px;" />
-        <span>水车</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/仓鼠.jpg" style="width: 50px;height: 50px;" />
-        <span>仓鼠</span>
-    </span>
-    <span>
-        <img src="./web/src/assets/avatar/千帆.jpg" style="width: 50px;height: 50px;" />
-        <span>千帆</span>
-    </span>
-</p>
+![](./qrcode.jpg)
--- a/index.html
+++ b/index.html
--- a/qrcode.jpg
+++ b/qrcode.jpg
--- a/simple-mind-map/full.js
+++ b/simple-mind-map/full.js
@@ -1,42 +1,28 @@
 import MindMap from './index'
-import MiniMap from './src/plugins/MiniMap.js'
-import Watermark from './src/plugins/Watermark.js'
-import KeyboardNavigation from './src/plugins/KeyboardNavigation.js'
-import ExportPDF from './src/plugins/ExportPDF.js'
-import Export from './src/plugins/Export.js'
-import Drag from './src/plugins/Drag.js'
-import Select from './src/plugins/Select.js'
-import AssociativeLine from './src/plugins/AssociativeLine'
-import RichText from './src/plugins/RichText'
-import NodeImgAdjust from './src/plugins/NodeImgAdjust.js'
-import TouchEvent from './src/plugins/TouchEvent.js'
-import Search from './src/plugins/Search.js'
+import MiniMap from './src/MiniMap.js'
+import Watermark from './src/Watermark.js'
+import KeyboardNavigation from './src/KeyboardNavigation.js'
+import Export from './src/Export.js'
+import Drag from './src/Drag.js'
+import Select from './src/Select.js'
+import AssociativeLine from './src/AssociativeLine'
+import RichText from './src/RichText'
 import xmind from './src/parse/xmind.js'
 import markdown from './src/parse/markdown.js'
 import icons from './src/svg/icons.js'
-import * as constants from './src/constants/constant.js'
-import themes from './src/themes/index.js'
-import * as defaultTheme from './src/themes/default.js'

 MindMap.xmind = xmind
 MindMap.markdown = markdown
 MindMap.iconList = icons.nodeIconList
-MindMap.constants = constants
-MindMap.themes = themes
-MindMap.defaultTheme = defaultTheme

 MindMap
  .usePlugin(MiniMap)
  .usePlugin(Watermark)
  .usePlugin(Drag)
  .usePlugin(KeyboardNavigation)
-  .usePlugin(ExportPDF)
  .usePlugin(Export)
  .usePlugin(Select)
  .usePlugin(AssociativeLine)
  .usePlugin(RichText)
-  .usePlugin(TouchEvent)
-  .usePlugin(NodeImgAdjust)
-  .usePlugin(Search)

 export default MindMap
--- a/simple-mind-map/index.js
+++ b/simple-mind-map/index.js
@@ -1,17 +1,129 @@
-import View from './src/core/view/View'
-import Event from './src/core/event/Event'
-import Render from './src/core/render/Render'
+import View from './src/View'
+import Event from './src/Event'
+import Render from './src/Render'
 import merge from 'deepmerge'
 import theme from './src/themes'
-import Style from './src/core/render/node/Style'
-import KeyCommand from './src/core/command/KeyCommand'
-import Command from './src/core/command/Command'
-import BatchExecution from './src/utils/BatchExecution'
-import { layoutValueList, CONSTANTS, commonCaches } from './src/constants/constant'
+import Style from './src/Style'
+import KeyCommand from './src/KeyCommand'
+import Command from './src/Command'
+import BatchExecution from './src/BatchExecution'
+import { layoutValueList, CONSTANTS } from './src/utils/constant'
 import { SVG } from '@svgdotjs/svg.js'
-import { simpleDeepClone, getType } from './src/utils'
+import { simpleDeepClone } from './src/utils'
 import defaultTheme, { checkIsNodeSizeIndependenceConfig } from './src/themes/default'
-import { defaultOpt } from './src/constants/defaultOptions'
+
+// 默认选项配置
+const defaultOpt = {
+  // 是否只读
+  readonly: false,
+  // 布局
+  layout: CONSTANTS.LAYOUT.LOGICAL_STRUCTURE,
+  // 如果结构为鱼骨图，那么可以通过该选项控制倾斜角度
+  fishboneDeg: 45,
+  // 主题
+  theme: 'default', // 内置主题：default（默认主题）
+  // 主题配置，会和所选择的主题进行合并
+  themeConfig: {},
+  // 放大缩小的增量比例
+  scaleRatio: 0.1,
+  // 最多显示几个标签
+  maxTag: 5,
+  // 导出图片时的内边距
+  exportPadding: 20,
+  // 展开收缩按钮尺寸
+  expandBtnSize: 20,
+  // 节点里图片和文字的间距
+  imgTextMargin: 5,
+  // 节点里各种文字信息的间距，如图标和文字的间距
+  textContentMargin: 2,
+  // 多选节点时鼠标移动到边缘时的画布移动偏移量
+  selectTranslateStep: 3,
+  // 多选节点时鼠标移动距边缘多少距离时开始偏移
+  selectTranslateLimit: 20,
+  // 自定义节点备注内容显示
+  customNoteContentShow: null,
+  /*
+        {
+            show(){},
+            hide(){}
+        }
+    */
+  // 是否开启节点自由拖拽
+  enableFreeDrag: false,
+  // 水印配置
+  watermarkConfig: {
+    text: '',
+    lineSpacing: 100,
+    textSpacing: 100,
+    angle: 30,
+    textStyle: {
+      color: '#999',
+      opacity: 0.5,
+      fontSize: 14
+    }
+  },
+  // 达到该宽度文本自动换行
+  textAutoWrapWidth: 500,
+  // 自定义鼠标滚轮事件处理
+  // 可以传一个函数，回调参数为事件对象
+  customHandleMousewheel: null,
+  // 鼠标滚动的行为，如果customHandleMousewheel传了自定义函数，这个属性不生效
+  mousewheelAction: CONSTANTS.MOUSE_WHEEL_ACTION.ZOOM,// zoom（放大缩小）、move（上下移动）
+  // 当mousewheelAction设为move时，可以通过该属性控制鼠标滚动一下视图移动的步长，单位px
+  mousewheelMoveStep: 100,
+  // 默认插入的二级节点的文字
+  defaultInsertSecondLevelNodeText: '二级节点',
+  // 默认插入的二级以下节点的文字
+  defaultInsertBelowSecondLevelNodeText: '分支主题',
+  // 展开收起按钮的颜色
+  expandBtnStyle: {
+    color: '#808080',
+    fill: '#fff'
+  },
+  // 自定义展开收起按钮的图标
+  expandBtnIcon: {
+    open: '',// svg字符串
+    close: ''
+  },
+  // 是否只有当鼠标在画布内才响应快捷键事件
+  enableShortcutOnlyWhenMouseInSvg: true,
+  // 是否开启节点动画过渡
+  enableNodeTransitionMove: true,
+  // 如果开启节点动画过渡，可以通过该属性设置过渡的时间，单位ms
+  nodeTransitionMoveDuration: 300,
+  // 初始根节点的位置
+  initRootNodePosition: null,
+  // 导出png、svg、pdf时的图形内边距
+  exportPaddingX: 10,
+  exportPaddingY: 10,
+  // 节点文本编辑框的z-index
+  nodeTextEditZIndex: 3000,
+  // 节点备注浮层的z-index
+  nodeNoteTooltipZIndex: 3000,
+  // 是否在点击了画布外的区域时结束节点文本的编辑状态
+  isEndNodeTextEditOnClickOuter: true,
+  // 最大历史记录数
+  maxHistoryCount: 1000,
+  // 是否一直显示节点的展开收起按钮，默认为鼠标移上去和激活时才显示
+  alwaysShowExpandBtn: false,
+  // 扩展节点可插入的图标
+  iconList: [
+    // {
+    //   name: '',// 分组名称
+    //   type: '',// 分组的值
+    //   list: [// 分组下的图标列表
+    //     {
+    //       name: '',// 图标名称
+    //       icon:''// 图标，可以传svg或图片
+    //     }
+    //   ]
+    // }
+  ],
+  // 节点最大缓存数量
+  maxNodeCacheCount: 1000,
+  // 关联线默认文字
+  defaultAssociativeLineText: '关联'
+}

 //  思维导图
 class MindMap {
@@ -32,12 +144,12 @@ class MindMap {
    this.svg = SVG().addTo(this.el).size(this.width, this.height)
    this.draw = this.svg.group()

+    // 节点id
+    this.uid = 1
+
    // 初始化主题
    this.initTheme()

-    // 初始化缓存数据
-    this.initCache()
-
    // 事件类
    this.event = new Event({
      mindMap: this
@@ -81,8 +193,6 @@ class MindMap {

  //  配置参数处理
  handleOpt(opt) {
-    // 深拷贝一份节点数据
-    opt.data = simpleDeepClone(opt.data || {})
    // 检查布局配置
    if (!layoutValueList.includes(opt.layout)) {
      opt.layout = CONSTANTS.LAYOUT.LOGICAL_STRUCTURE
@@ -134,23 +244,6 @@ class MindMap {
    this.event.off(event, fn)
  }

-  // 初始化缓存数据
-  initCache() {
-    Object.keys(commonCaches).forEach((key) => {
-      let type = getType(commonCaches[key])
-      let value = ''
-      switch(type) {
-        case 'Boolean':
-          value = false
-          break
-        default:
-          value = null
-          break
-      }
-      commonCaches[key] = value
-    })
-  }
-
  //  设置主题
  initTheme() {
    // 合并主题配置
@@ -213,7 +306,7 @@ class MindMap {
    this.opt.layout = layout
    this.view.reset()
    this.renderer.setLayout()
-    this.render(null, CONSTANTS.CHANGE_LAYOUT)
+    this.render()
  }

  //  执行命令
@@ -257,7 +350,7 @@ class MindMap {

  //  获取思维导图数据，节点树、主题、布局等
  getData(withConfig) {
-    let nodeData = this.command.getCopyData()
+    let nodeData = this.command.removeDataUid(this.command.getCopyData())
    let data = {}
    if (withConfig) {
      data = {
@@ -383,21 +476,6 @@ class MindMap {
      pluginOpt: plugin.pluginOpt
    })
  }
-
-  // 销毁
-  destroy() {
-    // 移除插件
-    [...MindMap.pluginList].forEach((plugin) => {
-      this[plugin.instanceName] = null
-    })
-    // 解绑事件
-    this.event.unbind()
-    // 移除画布节点
-    this.svg.remove()
-    // 去除给容器元素设置的背景样式
-    Style.removeBackgroundStyle(this.el)
-    this.el = null
-  }
 }

 // 插件列表
--- a/simple-mind-map/package-lock.json
+++ b/simple-mind-map/package-lock.json
@@ -1,14 +1,15 @@
 {
  "name": "simple-mind-map",
-  "version": "0.6.7",
+  "version": "0.4.7",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
-      "version": "0.6.7",
+      "version": "0.4.7",
      "license": "MIT",
      "dependencies": {
        "@svgdotjs/svg.js": "^3.0.16",
+        "canvg": "^3.0.7",
        "deepmerge": "^1.5.2",
        "eventemitter3": "^4.0.7",
        "html2canvas": "^1.4.1",
@@ -159,8 +160,7 @@
    "node_modules/@types/raf": {
      "version": "3.4.0",
      "resolved": "https://registry.npmjs.org/@types/raf/-/raf-3.4.0.tgz",
-      "integrity": "sha512-taW5/WYqo36N7V39oYyHP9Ipfd5pNFvGTIQsNGj86xV88YQ7GnI30/yMfKDF7Zgin0m3e+ikX88FvImnK4RjGw==",
-      "optional": true
+      "integrity": "sha512-taW5/WYqo36N7V39oYyHP9Ipfd5pNFvGTIQsNGj86xV88YQ7GnI30/yMfKDF7Zgin0m3e+ikX88FvImnK4RjGw=="
    },
    "node_modules/@types/unist": {
      "version": "2.0.6",
@@ -305,7 +305,6 @@
      "version": "3.0.10",
      "resolved": "https://registry.npmjs.org/canvg/-/canvg-3.0.10.tgz",
      "integrity": "sha512-qwR2FRNO9NlzTeKIPIKpnTY6fqwuYSequ8Ru8c0YkYU7U0oW+hLUvWadLvAu1Rl72OMNiFhoLu4f8eUjQ7l/+Q==",
-      "optional": true,
      "dependencies": {
        "@babel/runtime": "^7.12.5",
        "@types/raf": "^3.4.0",
@@ -382,7 +381,6 @@
      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.27.1.tgz",
      "integrity": "sha512-GutwJLBChfGCpwwhbYoqfv03LAfmiz7e7D/BNxzeMxwQf10GRSzqiOjx7AmtEk+heiD/JWmBuyBPgFtx0Sg1ww==",
      "hasInstallScript": true,
-      "optional": true,
      "funding": {
        "type": "opencollective",
        "url": "https://opencollective.com/core-js"
@@ -1815,8 +1813,7 @@
    "node_modules/performance-now": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
-      "integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==",
-      "optional": true
+      "integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow=="
    },
    "node_modules/prelude-ls": {
      "version": "1.2.1",
@@ -1911,7 +1908,6 @@
      "version": "3.4.1",
      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
      "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
-      "optional": true,
      "dependencies": {
        "performance-now": "^2.1.0"
      }
@@ -1986,7 +1982,6 @@
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/rgbcolor/-/rgbcolor-1.0.1.tgz",
      "integrity": "sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw==",
-      "optional": true,
      "engines": {
        "node": ">= 0.8.15"
      }
@@ -2080,7 +2075,6 @@
      "version": "2.5.0",
      "resolved": "https://registry.npmjs.org/stackblur-canvas/-/stackblur-canvas-2.5.0.tgz",
      "integrity": "sha512-EeNzTVfj+1In7aSLPKDD03F/ly4RxEuF/EX0YcOG0cKoPXs+SLZxDawQbexQDBzwROs4VKLWTOaZQlZkGBFEIQ==",
-      "optional": true,
      "engines": {
        "node": ">=0.1.14"
      }
@@ -2133,7 +2127,6 @@
      "version": "6.0.3",
      "resolved": "https://registry.npmjs.org/svg-pathdata/-/svg-pathdata-6.0.3.tgz",
      "integrity": "sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw==",
-      "optional": true,
      "engines": {
        "node": ">=12.0.0"
      }
@@ -2393,8 +2386,7 @@
    "@types/raf": {
      "version": "3.4.0",
      "resolved": "https://registry.npmjs.org/@types/raf/-/raf-3.4.0.tgz",
-      "integrity": "sha512-taW5/WYqo36N7V39oYyHP9Ipfd5pNFvGTIQsNGj86xV88YQ7GnI30/yMfKDF7Zgin0m3e+ikX88FvImnK4RjGw==",
-      "optional": true
+      "integrity": "sha512-taW5/WYqo36N7V39oYyHP9Ipfd5pNFvGTIQsNGj86xV88YQ7GnI30/yMfKDF7Zgin0m3e+ikX88FvImnK4RjGw=="
    },
    "@types/unist": {
      "version": "2.0.6",
@@ -2497,7 +2489,6 @@
      "version": "3.0.10",
      "resolved": "https://registry.npmjs.org/canvg/-/canvg-3.0.10.tgz",
      "integrity": "sha512-qwR2FRNO9NlzTeKIPIKpnTY6fqwuYSequ8Ru8c0YkYU7U0oW+hLUvWadLvAu1Rl72OMNiFhoLu4f8eUjQ7l/+Q==",
-      "optional": true,
      "requires": {
        "@babel/runtime": "^7.12.5",
        "@types/raf": "^3.4.0",
@@ -2553,8 +2544,7 @@
    "core-js": {
      "version": "3.27.1",
      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.27.1.tgz",
-      "integrity": "sha512-GutwJLBChfGCpwwhbYoqfv03LAfmiz7e7D/BNxzeMxwQf10GRSzqiOjx7AmtEk+heiD/JWmBuyBPgFtx0Sg1ww==",
-      "optional": true
+      "integrity": "sha512-GutwJLBChfGCpwwhbYoqfv03LAfmiz7e7D/BNxzeMxwQf10GRSzqiOjx7AmtEk+heiD/JWmBuyBPgFtx0Sg1ww=="
    },
    "core-util-is": {
      "version": "1.0.3",
@@ -3521,8 +3511,7 @@
    "performance-now": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
-      "integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==",
-      "optional": true
+      "integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow=="
    },
    "prelude-ls": {
      "version": "1.2.1",
@@ -3587,7 +3576,6 @@
      "version": "3.4.1",
      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
      "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
-      "optional": true,
      "requires": {
        "performance-now": "^2.1.0"
      }
@@ -3642,8 +3630,7 @@
    "rgbcolor": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/rgbcolor/-/rgbcolor-1.0.1.tgz",
-      "integrity": "sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw==",
-      "optional": true
+      "integrity": "sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw=="
    },
    "rimraf": {
      "version": "3.0.2",
@@ -3704,8 +3691,7 @@
    "stackblur-canvas": {
      "version": "2.5.0",
      "resolved": "https://registry.npmjs.org/stackblur-canvas/-/stackblur-canvas-2.5.0.tgz",
-      "integrity": "sha512-EeNzTVfj+1In7aSLPKDD03F/ly4RxEuF/EX0YcOG0cKoPXs+SLZxDawQbexQDBzwROs4VKLWTOaZQlZkGBFEIQ==",
-      "optional": true
+      "integrity": "sha512-EeNzTVfj+1In7aSLPKDD03F/ly4RxEuF/EX0YcOG0cKoPXs+SLZxDawQbexQDBzwROs4VKLWTOaZQlZkGBFEIQ=="
    },
    "string_decoder": {
      "version": "1.1.1",
@@ -3742,8 +3728,7 @@
    "svg-pathdata": {
      "version": "6.0.3",
      "resolved": "https://registry.npmjs.org/svg-pathdata/-/svg-pathdata-6.0.3.tgz",
-      "integrity": "sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw==",
-      "optional": true
+      "integrity": "sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw=="
    },
    "text-segmentation": {
      "version": "1.0.3",
--- a/simple-mind-map/package.json
+++ b/simple-mind-map/package.json
@@ -1,6 +1,6 @@
 {
  "name": "simple-mind-map",
-  "version": "0.6.10",
+  "version": "0.5.11",
  "description": "一个简单的web在线思维导图",
  "authors": [
    {
@@ -25,6 +25,7 @@
  "__main": "./dist/simpleMindMap.umd.min.js",
  "dependencies": {
    "@svgdotjs/svg.js": "^3.0.16",
+    "canvg": "^3.0.7",
    "deepmerge": "^1.5.2",
    "eventemitter3": "^4.0.7",
    "html2canvas": "^1.4.1",
--- a/simple-mind-map/src/plugins/AssociativeLine.js
+++ b/simple-mind-map/src/plugins/AssociativeLine.js
@@ -1,4 +1,4 @@
-import { walk, bfsWalk, throttle } from '../utils'
+import { walk, bfsWalk, throttle } from './utils/'
 import { v4 as uuid } from 'uuid'
 import {
  getAssociativeLineTargetIndex,
@@ -7,11 +7,11 @@ import {
  getNodePoint,
  computeNodePoints,
  getNodeLinePath
-} from './associativeLine/associativeLineUtils'
-import associativeLineControlsMethods from './associativeLine/associativeLineControls'
-import associativeLineTextMethods from './associativeLine/associativeLineText'
+} from './utils/associativeLineUtils'
+import associativeLineControlsMethods from './utils/associativeLineControls'
+import associativeLineTextMethods from './utils/associativeLineText'

-// 关联线插件
+// 关联线类
 class AssociativeLine {
  constructor(opt = {}) {
    this.mindMap = opt.mindMap
@@ -91,7 +91,12 @@ class AssociativeLine {
    this.mindMap.on('node_dragging', this.onNodeDragging.bind(this))
    this.mindMap.on('node_dragend', this.onNodeDragend.bind(this))
    // 拖拽控制点
-    this.mindMap.on('mouseup', this.onControlPointMouseup.bind(this))
+    window.addEventListener('mousemove', e => {
+      this.onControlPointMousemove(e)
+    })
+    window.addEventListener('mouseup', e => {
+      this.onControlPointMouseup(e)
+    })
    // 缩放事件
    this.mindMap.on('scale', this.onScale)
  }
@@ -261,13 +266,12 @@ class AssociativeLine {

  // 鼠标移动事件
  onMousemove(e) {
-    this.onControlPointMousemove(e)
+    if (!this.isCreatingLine) return
    this.updateCreatingLine(e)
  }

  // 更新创建过程中的连接线
  updateCreatingLine(e) {
-    if (!this.isCreatingLine) return
    let { x, y } = this.getTransformedEventPos(e)
    let startPoint = getNodePoint(this.creatingStartNode)
    let offsetX = x > startPoint.x ? -10 : 10
--- a/simple-mind-map/src/utils/BatchExecution.js
+++ b/simple-mind-map/src/utils/BatchExecution.js
@@ -1,4 +1,4 @@
-import { nextTick } from '.'
+import { nextTick } from './utils'

 //  批量执行
 class BatchExecution {
--- a/simple-mind-map/src/core/command/Command.js
+++ b/simple-mind-map/src/core/command/Command.js
@@ -1,4 +1,4 @@
-import { copyRenderTree, simpleDeepClone, nextTick } from '../../utils'
+import { copyRenderTree, simpleDeepClone, nextTick } from './utils'

 //  命令类
 class Command {
@@ -89,7 +89,7 @@ class Command {
      this.history.shift()
    }
    this.activeHistoryIndex = this.history.length - 1
-    this.mindMap.emit('data_change', data)
+    this.mindMap.emit('data_change', this.removeDataUid(data))
    this.mindMap.emit(
      'back_forward',
      this.activeHistoryIndex,
@@ -110,7 +110,7 @@ class Command {
        this.history.length
      )
      let data = simpleDeepClone(this.history[this.activeHistoryIndex])
-      this.mindMap.emit('data_change', data)
+      this.mindMap.emit('data_change', this.removeDataUid(data))
      return data
    }
  }
@@ -125,7 +125,7 @@ class Command {
      this.activeHistoryIndex += step
      this.mindMap.emit('back_forward', this.activeHistoryIndex, this.history.length)
      let data = simpleDeepClone(this.history[this.activeHistoryIndex])
-      this.mindMap.emit('data_change', data)
+      this.mindMap.emit('data_change', this.removeDataUid(data))
      return data
    }
  }
--- a/simple-mind-map/src/plugins/Drag.js
+++ b/simple-mind-map/src/plugins/Drag.js
@@ -1,7 +1,8 @@
-import { bfsWalk, throttle } from '../utils'
-import Base from '../layouts/Base'
+import { bfsWalk, throttle } from './utils'
+import Base from './layouts/Base'
+
+//  节点拖动类

-// 节点拖动插件
 class Drag extends Base {
  //  构造函数
  constructor({ mindMap }) {
--- a/simple-mind-map/src/core/event/Event.js
+++ b/simple-mind-map/src/core/event/Event.js
@@ -1,5 +1,5 @@
 import EventEmitter from 'eventemitter3'
-import { CONSTANTS } from '../../constants/constant'
+import { CONSTANTS } from './utils/constant'

 //  事件类
 class Event extends EventEmitter {
@@ -9,7 +9,6 @@ class Event extends EventEmitter {
    this.opt = opt
    this.mindMap = opt.mindMap
    this.isLeftMousedown = false
-    this.isRightMousedown = false
    this.mousedownPos = {
      x: 0,
      y: 0
@@ -90,8 +89,6 @@ class Event extends EventEmitter {
    // 鼠标左键
    if (e.which === 1) {
      this.isLeftMousedown = true
-    } else if (e.which === 3) {
-      this.isRightMousedown = true
    }
    this.mousedownPos.x = e.clientX
    this.mousedownPos.y = e.clientY
@@ -100,17 +97,12 @@ class Event extends EventEmitter {

  //  鼠标移动事件
  onMousemove(e) {
-    let { useLeftKeySelectionRightKeyDrag } = this.mindMap.opt
    this.mousemovePos.x = e.clientX
    this.mousemovePos.y = e.clientY
    this.mousemoveOffset.x = e.clientX - this.mousedownPos.x
    this.mousemoveOffset.y = e.clientY - this.mousedownPos.y
    this.emit('mousemove', e, this)
-    if (
-      useLeftKeySelectionRightKeyDrag
-        ? this.isRightMousedown
-        : this.isLeftMousedown
-    ) {
+    if (this.isLeftMousedown) {
      e.preventDefault()
      this.emit('drag', e, this)
    }
@@ -119,7 +111,6 @@ class Event extends EventEmitter {
  //  鼠标松开事件
  onMouseup(e) {
    this.isLeftMousedown = false
-    this.isRightMousedown = false
    this.emit('mouseup', e, this)
  }

@@ -140,13 +131,7 @@ class Event extends EventEmitter {
      if ((e.wheelDeltaX || e.detail) > 0) dir = CONSTANTS.DIR.LEFT
      if ((e.wheelDeltaX || e.detail) < 0) dir = CONSTANTS.DIR.RIGHT
    }
-    // 判断是否是触控板
-    let isTouchPad = false
-    // mac、windows
-    if (e.wheelDeltaY === e.deltaY * -3 || Math.abs(e.wheelDeltaY) <= 10) {
-      isTouchPad = true
-    }
-    this.emit('mousewheel', e, dir, this, isTouchPad)
+    this.emit('mousewheel', e, dir, this)
  }

  //  鼠标右键菜单事件
--- a/simple-mind-map/src/plugins/Export.js
+++ b/simple-mind-map/src/plugins/Export.js
@@ -1,9 +1,11 @@
-import { imgToDataUrl, downloadFile, readBlob, removeHTMLEntities } from '../utils'
+import { imgToDataUrl, downloadFile, readBlob } from './utils'
+import JsPDF from 'jspdf'
 import { SVG } from '@svgdotjs/svg.js'
-import drawBackgroundImageToCanvas from '../utils/simulateCSSBackgroundInCanvas'
-import { transformToMarkdown } from '../parse/toMarkdown'
+import drawBackgroundImageToCanvas from './utils/simulateCSSBackgroundInCanvas'
+import { transformToMarkdown } from './parse/toMarkdown'
+const URL = window.URL || window.webkitURL || window

-//  导出插件
+//  导出类
 class Export {
  //  构造函数
  constructor(opt) {
@@ -154,7 +156,6 @@ class Export {
   */
  async png(name, transparent = false) {
    let { node, str } = await this.getSvgData()
-    str = removeHTMLEntities(str)
    // 如果开启了富文本，则使用htmltocanvas转换为图片
    if (this.mindMap.richText) {
      let res =  await this.mindMap.richText.handleExportPng(node.node)
@@ -174,22 +175,34 @@ class Export {

  //  导出为pdf
  async pdf(name) {
-    if (!this.mindMap.doExportPDF) {
-      throw new Error('请注册ExportPDF插件')
-    }
    let img = await this.png()
-    this.mindMap.doExportPDF.pdf(name, img)
-  }
-
-  // 导出为xmind
-  async xmind(name) {
-    if (!this.mindMap.doExportXMind) {
-      throw new Error('请注册ExportXMind插件')
+    let pdf = new JsPDF('', 'pt', 'a4')
+    let a4Width = 595
+    let a4Height = 841
+    let a4Ratio = a4Width / a4Height
+    let image = new Image()
+    image.onload = () => {
+      let imageWidth = image.width
+      let imageHeight = image.height
+      let imageRatio = imageWidth / imageHeight
+      let w, h
+      if (imageWidth <= a4Width && imageHeight <= a4Height) {
+        // 使用图片原始宽高
+        w = imageWidth
+        h = imageHeight
+      } else if (a4Ratio > imageRatio) {
+        // 以a4Height为高度，缩放图片宽度
+        w = imageRatio * a4Height
+        h = a4Height
+      } else {
+        // 以a4Width为宽度，缩放图片高度
+        w = a4Width
+        h = a4Width / imageRatio
+      }
+      pdf.addImage(img, 'PNG', (a4Width - w) / 2, (a4Height - h) / 2, w, h)
+      pdf.save(name)
    }
-    const data = this.mindMap.getData()
-    const blob = await this.mindMap.doExportXMind.xmind(data, name)
-    const res = await readBlob(blob)
-    return res
+    image.src = img
  }

  //  导出为svg
@@ -208,7 +221,6 @@ class Export {
    node.first().before(SVG(`<title>${name}</title>`))
    await this.drawBackgroundToSvg(node)
    let str = node.svg()
-    str = removeHTMLEntities(str)
    // 转换成blob数据
    let blob = new Blob([str], {
      type: 'image/svg+xml'
--- a/simple-mind-map/src/core/command/KeyCommand.js
+++ b/simple-mind-map/src/core/command/KeyCommand.js
@@ -1,4 +1,4 @@
-import { keyMap } from './keyMap'
+import { keyMap } from './utils/keyMap'
 //  快捷按键、命令处理类
 export default class KeyCommand {
  //  构造函数
@@ -57,11 +57,8 @@ export default class KeyCommand {
      }
      Object.keys(this.shortcutMap).forEach(key => {
        if (this.checkKey(e, key)) {
-          // 粘贴事件不组织，因为要监听paste事件
-          if (!this.checkKey(e, 'Control+v')) {
-            e.stopPropagation()
-            e.preventDefault()
-          }
+          e.stopPropagation()
+          e.preventDefault()
          this.shortcutMap[key].forEach(fn => {
            fn()
          })
--- a/simple-mind-map/src/plugins/KeyboardNavigation.js
+++ b/simple-mind-map/src/plugins/KeyboardNavigation.js
@@ -1,7 +1,7 @@
-import { bfsWalk } from '../utils'
-import { CONSTANTS } from '../constants/constant'
+import { bfsWalk } from './utils'
+import { CONSTANTS } from './utils/constant'

-//  键盘导航插件
+//  键盘导航类
 class KeyboardNavigation {
  //  构造函数
  constructor(opt) {
@@ -28,7 +28,8 @@ class KeyboardNavigation {
      this.focus(dir)
    } else {
      let root = this.mindMap.renderer.root
-      this.mindMap.execCommand('GO_TARGET_NODE', root)
+      this.mindMap.renderer.moveNodeToCenter(root)
+      root.active()
    }
  }

@@ -80,7 +81,8 @@ class KeyboardNavigation {

    // 找到了则让目标节点聚焦
    if (targetNode) {
-      this.mindMap.execCommand('GO_TARGET_NODE', targetNode)
+      this.mindMap.renderer.moveNodeToCenter(targetNode)
+      targetNode.active()
    }
  }

--- a/simple-mind-map/src/plugins/MiniMap.js
+++ b/simple-mind-map/src/plugins/MiniMap.js
@@ -1,4 +1,4 @@
-// 小地图插件
+// 小地图类
 class MiniMap {
  //  构造函数
  constructor(opt) {
--- a/simple-mind-map/src/core/render/node/Node.js
+++ b/simple-mind-map/src/core/render/node/Node.js
@@ -1,12 +1,12 @@
 import Style from './Style'
 import Shape from './Shape'
-import { asyncRun, nodeToHTML } from '../../../utils'
-import { G, Rect, ForeignObject, SVG } from '@svgdotjs/svg.js'
-import nodeGeneralizationMethods from './nodeGeneralization'
-import nodeExpandBtnMethods from './nodeExpandBtn'
-import nodeCommandWrapsMethods from './nodeCommandWraps'
-import nodeCreateContentsMethods from './nodeCreateContents'
-import { CONSTANTS } from '../../../constants/constant'
+import { asyncRun } from './utils'
+import { G, Rect } from '@svgdotjs/svg.js'
+import nodeGeneralizationMethods from './utils/nodeGeneralization'
+import nodeExpandBtnMethods from './utils/nodeExpandBtn'
+import nodeCommandWrapsMethods from './utils/nodeCommandWraps'
+import nodeCreateContentsMethods from './utils/nodeCreateContents'
+import { CONSTANTS } from './utils/constant'

 //  节点类
 class Node {
@@ -59,7 +59,6 @@ class Node {
    this.group = null
    this.shapeNode = null // 节点形状节点
    // 节点内容对象
-    this._customNodeContent = null
    this._imgData = null
    this._iconData = null
    this._textData = null
@@ -155,13 +154,6 @@ class Node {

  //  创建节点的各个内容对象数据
  createNodeData() {
-    // 自定义节点内容
-    let { isUseCustomNodeContent, customCreateNodeContent } = this.mindMap.opt
-    if (isUseCustomNodeContent && customCreateNodeContent) {
-      this._customNodeContent = customCreateNodeContent(this)
-    }
-    // 如果没有返回内容，那么还是使用内置的节点内容
-    if (this._customNodeContent) return
    this._imgData = this.createImgNode()
    this._iconData = this.createIconNode()
    this._textData = this.createTextNode()
@@ -184,14 +176,6 @@ class Node {

  //  计算节点尺寸信息
  getNodeRect() {
-    // 自定义节点内容
-    if (this.isUseCustomNodeContent()) {
-      let rect = this.measureCustomNodeContentSize(this._customNodeContent)
-      return {
-        width: rect.width,
-        height: rect.height
-      }
-    }
    // 宽高
    let imgContentWidth = 0
    let imgContentHeight = 0
@@ -269,20 +253,19 @@ class Node {
    this.group.add(this.shapeNode)
    this.updateNodeShape()
    // 渲染一个隐藏的矩形区域，用来触发展开收起按钮的显示
-    this.renderExpandBtnPlaceholderRect()
+    if (!this.mindMap.opt.alwaysShowExpandBtn) {
+      if (!this._unVisibleRectRegionNode) {
+        this._unVisibleRectRegionNode = new Rect()
+      }
+      this._unVisibleRectRegionNode.fill({
+        color: 'transparent'
+      }).size(this.expandBtnSize, height).x(width).y(0)
+      this.group.add(this._unVisibleRectRegionNode)
+    }
    // 概要节点添加一个带所属节点id的类名
    if (this.isGeneralization && this.generalizationBelongNode) {
      this.group.addClass('generalization_' + this.generalizationBelongNode.uid)
    }
-    // 如果存在自定义节点内容，那么使用自定义节点内容
-    if (this.isUseCustomNodeContent()) {
-      let foreignObject = new ForeignObject()
-      foreignObject.width(width)
-      foreignObject.height(height)
-      foreignObject.add(SVG(this._customNodeContent))
-      this.group.add(foreignObject)
-      return
-    }
    // 图片节点
    let imgHeight = 0
    if (this._imgData) {
@@ -356,31 +339,16 @@ class Node {
    this.group.add(textContentNested)
  }

-  // 渲染展开收起按钮的隐藏占位元素
-  renderExpandBtnPlaceholderRect() {
-    if (!this.mindMap.opt.alwaysShowExpandBtn) {
-      let { width, height } = this
-      if (!this._unVisibleRectRegionNode) {
-        this._unVisibleRectRegionNode = new Rect()
-        this._unVisibleRectRegionNode.fill({
-          color: 'transparent'
-        })
-      }
-      this.group.add(this._unVisibleRectRegionNode)
-      this.renderer.layout.renderExpandBtnRect(this._unVisibleRectRegionNode, this.expandBtnSize, width, height, this)
-    }
-  }
-
  // 给节点绑定事件
  bindGroupEvent() {
    // 单击事件，选中节点
    this.group.on('click', e => {
-      this.mindMap.emit('node_click', this, e)
      if (this.isMultipleChoice) {
        e.stopPropagation()
        this.isMultipleChoice = false
        return
      }
+      this.mindMap.emit('node_click', this, e)
      this.active(e)
    })
    this.group.on('mousedown', e => {
@@ -391,7 +359,7 @@ class Node {
        e.stopPropagation()
      }
      // 多选和取消多选
-      if (e.ctrlKey && this.mindMap.opt.enableCtrlKeyNodeSelection) {
+      if (e.ctrlKey) {
        this.isMultipleChoice = true
        let isActive = this.nodeData.data.isActive
        if (!isActive)
@@ -440,8 +408,7 @@ class Node {
    // 右键菜单事件
    this.group.on('contextmenu', e => {
      // 按住ctrl键点击鼠标左键不知为何触发的是contextmenu事件
-      if (this.mindMap.opt.readonly || e.ctrlKey) {
-        // || this.isGeneralization
+      if (this.mindMap.opt.readonly || e.ctrlKey) {// || this.isGeneralization
        return
      }
      e.stopPropagation()
@@ -475,9 +442,8 @@ class Node {
    if (!this.group) {
      return
    }
-    let {
-      alwaysShowExpandBtn
-    } = this.mindMap.opt
+    let { enableNodeTransitionMove, nodeTransitionMoveDuration, alwaysShowExpandBtn } =
+      this.mindMap.opt
    if (alwaysShowExpandBtn) {
      // 需要移除展开收缩按钮
      if (this._expandBtn && this.nodeData.children.length <= 0) {
@@ -501,7 +467,13 @@ class Node {
    let t = this.group.transform()
    // 如果节点位置没有变化，则返回
    if (this.left === t.translateX && this.top === t.translateY) return
-    this.group.translate(this.left - t.translateX, this.top - t.translateY)
+    if (!isLayout && enableNodeTransitionMove) {
+      this.group
+        .animate(nodeTransitionMoveDuration)
+        .translate(this.left - t.translateX, this.top - t.translateY)
+    } else {
+      this.group.translate(this.left - t.translateX, this.top - t.translateY)
+    }
  }

  // 重新渲染节点，即重新创建节点内容、计算节点大小、计算节点内容布局、更新展开收起按钮，概要及位置
@@ -523,6 +495,8 @@ class Node {

  //  递归渲染
  render(callback = () => {}) {
+    let { enableNodeTransitionMove, nodeTransitionMoveDuration } =
+      this.mindMap.opt
    // 节点
    // 重新渲染连线
    this.renderLine()
@@ -544,10 +518,6 @@ class Node {
        this.needLayout = false
        this.layout()
      }
-      if (this.needRerenderExpandBtnPlaceholderRect) {
-        this.needRerenderExpandBtnPlaceholderRect = false
-        this.renderExpandBtnPlaceholderRect()
-      }
      this.update()
    }
    // 子节点
@@ -570,14 +540,20 @@ class Node {
        })
      )
    } else {
-      callback()
+      if (enableNodeTransitionMove && !isLayout) {
+        setTimeout(() => {
+          callback()
+        }, nodeTransitionMoveDuration)
+      } else {
+        callback()
+      }
    }
    // 手动插入的节点立即获得焦点并且开启编辑模式
    if (this.nodeData.inserting) {
      delete this.nodeData.inserting
      this.active()
      setTimeout(() => {
-        this.mindMap.emit('node_dblclick', this, null, true)
+        this.mindMap.emit('node_dblclick', this)
      }, 0)
    }
  }
@@ -782,7 +758,7 @@ class Node {

  //  获取padding值
  getPaddingVale() {
-    let { isActive } = this.nodeData.data
+    let { isActive }= this.nodeData.data
    return {
      paddingX: this.getStyle('paddingX', true, isActive),
      paddingY: this.getStyle('paddingY', true, isActive)
@@ -822,11 +798,6 @@ class Node {
  getData(key) {
    return key ? this.nodeData.data[key] || '' : this.nodeData.data
  }
-
-  // 是否存在自定义样式
-  hasCustomStyle() {
-    return this.style.hasCustomStyle()
-  }
 }

 export default Node
--- a/simple-mind-map/src/core/render/Render.js
+++ b/simple-mind-map/src/core/render/Render.js
@@ -1,22 +1,15 @@
 import merge from 'deepmerge'
-import LogicalStructure from '../../layouts/LogicalStructure'
-import MindMap from '../../layouts/MindMap'
-import CatalogOrganization from '../../layouts/CatalogOrganization'
-import OrganizationStructure from '../../layouts/OrganizationStructure'
-import Timeline from '../../layouts/Timeline'
-import VerticalTimeline from '../../layouts/VerticalTimeline'
-import Fishbone from '../../layouts/Fishbone'
+import LogicalStructure from './layouts/LogicalStructure'
+import MindMap from './layouts/MindMap'
+import CatalogOrganization from './layouts/CatalogOrganization'
+import OrganizationStructure from './layouts/OrganizationStructure'
+import Timeline from './layouts/Timeline'
+import Fishbone from './layouts/Fishbone'
 import TextEdit from './TextEdit'
-import {
-  copyNodeTree,
-  simpleDeepClone,
-  walk,
-  bfsWalk,
-  loadImage
-} from '../../utils'
-import { shapeList } from './node/Shape'
-import { lineStyleProps } from '../../themes/default'
-import { CONSTANTS } from '../../constants/constant'
+import { copyNodeTree, simpleDeepClone, walk } from './utils'
+import { shapeList } from './Shape'
+import { lineStyleProps } from './themes/default'
+import { CONSTANTS } from './utils/constant'

 // 布局列表
 const layouts = {
@@ -32,10 +25,8 @@ const layouts = {
  [CONSTANTS.LAYOUT.TIMELINE]: Timeline,
  // 时间轴2
  [CONSTANTS.LAYOUT.TIMELINE2]: Timeline,
-  // 竖向时间轴
-  [CONSTANTS.LAYOUT.VERTICAL_TIMELINE]: VerticalTimeline,
  // 鱼骨图
-  [CONSTANTS.LAYOUT.FISHBONE]: Fishbone
+  [CONSTANTS.LAYOUT.FISHBONE]: Fishbone,
 }

 //  渲染
@@ -48,7 +39,7 @@ class Render {
    this.themeConfig = this.mindMap.themeConfig
    this.draw = this.mindMap.draw
    // 渲染树，操作过程中修改的都是这里的数据
-    this.renderTree = merge({},this.mindMap.opt.data || {})
+    this.renderTree = merge({}, this.mindMap.opt.data || {})
    // 是否重新渲染
    this.reRender = false
    // 是否正在渲染中
@@ -66,12 +57,6 @@ class Render {
    this.root = null
    // 文本编辑框，需要再bindEvent之前实例化，否则单击事件只能触发隐藏文本编辑框，而无法保存文本修改
    this.textEdit = new TextEdit(this)
-    // 当前复制的数据
-    this.lastBeingCopyData = null
-    this.beingCopyData = null
-    this.beingPasteText = ''
-    this.beingPasteImgSize = 0
-    this.currentBeingPasteType = ''
    // 布局
    this.setLayout()
    // 绑定事件
@@ -94,24 +79,12 @@ class Render {
  //   绑定事件
  bindEvent() {
    // 点击事件
-    this.mindMap.on('draw_click', e => {
+    this.mindMap.on('draw_click', () => {
      // 清除激活状态
-      let isTrueClick = true
-      let { useLeftKeySelectionRightKeyDrag } = this.mindMap.opt
-      if (useLeftKeySelectionRightKeyDrag) {
-        let mousedownPos = this.mindMap.event.mousedownPos
-        isTrueClick =
-          Math.abs(e.clientX - mousedownPos.x) <= 5 &&
-          Math.abs(e.clientY - mousedownPos.y) <= 5
-      }
-      if (isTrueClick && this.activeNodeList.length > 0) {
+      if (this.activeNodeList.length > 0) {
        this.mindMap.execCommand('CLEAR_ACTIVE_NODE')
      }
    })
-    // 粘贴事件
-    this.mindMap.on('paste', data => {
-      this.onPaste(data)
-    })
  }

  //  注册命令
@@ -213,9 +186,6 @@ class Render {
    // 设置节点形状
    this.setNodeShape = this.setNodeShape.bind(this)
    this.mindMap.command.add('SET_NODE_SHAPE', this.setNodeShape)
-    // 定位节点
-    this.goTargetNode = this.goTargetNode.bind(this)
-    this.mindMap.command.add('GO_TARGET_NODE', this.goTargetNode)
  }

  //  注册快捷键
@@ -233,7 +203,7 @@ class Render {
    }
    this.mindMap.keyCommand.addShortcut('Enter', this.insertNodeWrap)
    // 插入概要
-    this.mindMap.keyCommand.addShortcut('Control+g', this.addGeneralization)
+    this.mindMap.keyCommand.addShortcut('Control+s', this.addGeneralization)
    // 展开/收起节点
    this.toggleActiveExpand = this.toggleActiveExpand.bind(this)
    this.mindMap.keyCommand.addShortcut('/', this.toggleActiveExpand)
@@ -260,14 +230,6 @@ class Render {
    // 下移节点
    this.mindMap.keyCommand.addShortcut('Control+Down', this.downNode)
    // 复制节点、剪切节点、粘贴节点的快捷键需开发者自行注册实现，可参考demo
-    this.copy = this.copy.bind(this)
-    this.mindMap.keyCommand.addShortcut('Control+c', this.copy)
-    this.mindMap.keyCommand.addShortcut('Control+v', () => {
-      // 隐藏输入框可能会失去焦点，所以要重新聚焦
-      this.textEdit.focusHiddenInput()
-    })
-    this.cut = this.cut.bind(this)
-    this.mindMap.keyCommand.addShortcut('Control+x', this.cut)
  }

  //  开启文字编辑，会禁用回车键和删除键相关快捷键防止冲突
@@ -288,6 +250,7 @@ class Render {

  //   渲染
  render(callback = () => {}, source) {
+    let t = Date.now()
    // 如果当前还没有渲染完毕，不再触发渲染
    if (this.isRendering) {
      // 等待当前渲染完毕后再进行一次渲染
@@ -307,7 +270,7 @@ class Render {
    // 计算布局
    this.layout.doLayout(root => {
      // 删除本次渲染时不再需要的节点
-      Object.keys(this.lastNodeCache).forEach(uid => {
+      Object.keys(this.lastNodeCache).forEach((uid) => {
        if (!this.nodeCache[uid]) {
          this.lastNodeCache[uid].destroy()
          if (this.lastNodeCache[uid].parent) {
@@ -318,7 +281,7 @@ class Render {
      // 更新根节点
      this.root = root
      // 渲染节点
-      this.root.render(() => {
+      const onEnd = () => {
        this.isRendering = false
        this.mindMap.emit('node_tree_render_end')
        callback && callback()
@@ -327,13 +290,22 @@ class Render {
          this.render(callback, source)
        } else {
          // 触发一次保存，因为修改了渲染树的数据
-          if (
-            this.mindMap.richText &&
-            [CONSTANTS.CHANGE_THEME, CONSTANTS.SET_DATA].includes(source)
-          ) {
+          if (this.mindMap.richText && [CONSTANTS.CHANGE_THEME, CONSTANTS.SET_DATA].includes(source)) {
            this.mindMap.command.addHistory()
          }
        }
+      }
+      let { enableNodeTransitionMove, nodeTransitionMoveDuration } =
+      this.mindMap.opt
+      this.root.render(() => {
+        let dur = Date.now() - t
+        if (enableNodeTransitionMove && dur <= nodeTransitionMoveDuration) {
+          setTimeout(() => {
+            onEnd()
+          }, nodeTransitionMoveDuration - dur);
+        } else {
+          onEnd()
+        }
      })
    })
    this.mindMap.emit('node_active', null, this.activeNodeList)
@@ -435,7 +407,7 @@ class Render {
  // 规范指定节点数据
  formatAppointNodes(appointNodes) {
    if (!appointNodes) return []
-    return Array.isArray(appointNodes) ? appointNodes : [appointNodes]
+    return Array.isArray(appointNodes) ? appointNodes: [appointNodes]
  }

  //  插入同级节点，多个节点只会操作第一个节点
@@ -444,35 +416,22 @@ class Render {
    if (this.activeNodeList.length <= 0 && appointNodes.length <= 0) {
      return
    }
-    this.textEdit.hideEditTextBox()
-    let {
-      defaultInsertSecondLevelNodeText,
-      defaultInsertBelowSecondLevelNodeText
-    } = this.mindMap.opt
+    let { defaultInsertSecondLevelNodeText, defaultInsertBelowSecondLevelNodeText } = this.mindMap.opt
    let list = appointNodes.length > 0 ? appointNodes : this.activeNodeList
    let first = list[0]
-    if (first.isGeneralization) {
-      return
-    }
    if (first.isRoot) {
      this.insertChildNode(openEdit, appointNodes, appointData)
    } else {
-      let text =
-        first.layerIndex === 1
-          ? defaultInsertSecondLevelNodeText
-          : defaultInsertBelowSecondLevelNodeText
+      let text = first.layerIndex === 1 ? defaultInsertSecondLevelNodeText : defaultInsertBelowSecondLevelNodeText
      if (first.layerIndex === 1) {
        first.parent.destroy()
      }
      let index = this.getNodeIndex(first)
-      let isRichText = !!this.mindMap.richText
      first.parent.nodeData.children.splice(index + 1, 0, {
        inserting: openEdit,
        data: {
          text: text,
          expand: true,
-          richText: isRichText,
-          resetRichText: isRichText,
          ...(appointData || {})
        },
        children: []
@@ -487,30 +446,18 @@ class Render {
    if (this.activeNodeList.length <= 0 && appointNodes.length <= 0) {
      return
    }
-    this.textEdit.hideEditTextBox()
-    let {
-      defaultInsertSecondLevelNodeText,
-      defaultInsertBelowSecondLevelNodeText
-    } = this.mindMap.opt
+    let { defaultInsertSecondLevelNodeText, defaultInsertBelowSecondLevelNodeText } = this.mindMap.opt
    let list = appointNodes.length > 0 ? appointNodes : this.activeNodeList
    list.forEach(node => {
-      if (node.isGeneralization) {
-        return
-      }
      if (!node.nodeData.children) {
        node.nodeData.children = []
      }
-      let text = node.isRoot
-        ? defaultInsertSecondLevelNodeText
-        : defaultInsertBelowSecondLevelNodeText
-      let isRichText = !!this.mindMap.richText
+      let text = node.isRoot ? defaultInsertSecondLevelNodeText : defaultInsertBelowSecondLevelNodeText
      node.nodeData.children.push({
        inserting: openEdit,
        data: {
          text: text,
          expand: true,
-          richText: isRichText,
-          resetRichText: isRichText,
          ...(appointData || {})
        },
        children: []
@@ -578,81 +525,13 @@ class Render {
    this.mindMap.render()
  }

-  // 复制节点
-  copy() {
-    this.beingCopyData = this.copyNode()
-  }
-
-  // 剪切节点
-  cut() {
-    this.mindMap.execCommand('CUT_NODE', copyData => {
-      this.beingCopyData = copyData
-    })
-  }
-
-  // 粘贴节点
-  paste() {
-    if (this.beingCopyData) {
-      this.mindMap.execCommand('PASTE_NODE', this.beingCopyData)
-    }
-  }
-
-  // 粘贴事件
-  async onPaste({ text, img }) {
-    // 检查剪切板数据是否有变化
-    // 通过图片大小来判断图片是否发生变化，可能是不准确的，但是目前没有其他好方法
-    const imgSize = img ? img.size : 0
-    if (this.beingPasteText !== text || this.beingPasteImgSize !== imgSize) {
-      this.currentBeingPasteType = CONSTANTS.PASTE_TYPE.CLIP_BOARD
-      this.beingPasteText = text
-      this.beingPasteImgSize = imgSize
-    }
-    // 检查要粘贴的节点数据是否有变化，节点优先级高于剪切板
-    if (this.lastBeingCopyData !== this.beingCopyData) {
-      this.lastBeingCopyData = this.beingCopyData
-      this.currentBeingPasteType = CONSTANTS.PASTE_TYPE.CANVAS
-    }
-    // 粘贴剪切板的数据
-    if (this.currentBeingPasteType === CONSTANTS.PASTE_TYPE.CLIP_BOARD) {
-      // 存在文本，则创建子节点
-      if (text) {
-        this.mindMap.execCommand('INSERT_CHILD_NODE', false, [], {
-          text
-        })
-      }
-      // 存在图片，则添加到当前激活节点
-      if (img) {
-        try {
-          let imgData = await loadImage(img)
-          if (this.activeNodeList.length > 0) {
-            this.activeNodeList.forEach(node => {
-              this.mindMap.execCommand('SET_NODE_IMAGE', node, {
-                url: imgData.url,
-                title: '',
-                width: imgData.size.width,
-                height: imgData.size.height
-              })
-            })
-          }
-        } catch (error) {
-          console.log(error)
-        }
-      }
-    } else {
-      // 粘贴节点数据
-      this.paste()
-    }
-  }
-
  //  将节点移动到另一个节点的前面
  insertBefore(node, exist) {
    if (node.isRoot) {
      return
    }
    // 如果是二级节点变成了下级节点，或是下级节点变成了二级节点，节点样式需要更新
-    let nodeLayerChanged =
-      (node.layerIndex === 1 && exist.layerIndex !== 1) ||
-      (node.layerIndex !== 1 && exist.layerIndex === 1)
+    let nodeLayerChanged = (node.layerIndex === 1 && exist.layerIndex !== 1) || (node.layerIndex !== 1 && exist.layerIndex === 1)
    // 移动节点
    let nodeParent = node.parent
    let nodeBorthers = nodeParent.children
@@ -689,9 +568,7 @@ class Render {
      return
    }
    // 如果是二级节点变成了下级节点，或是下级节点变成了二级节点，节点样式需要更新
-    let nodeLayerChanged =
-      (node.layerIndex === 1 && exist.layerIndex !== 1) ||
-      (node.layerIndex !== 1 && exist.layerIndex === 1)
+    let nodeLayerChanged = (node.layerIndex === 1 && exist.layerIndex !== 1) || (node.layerIndex !== 1 && exist.layerIndex === 1)
    // 移动节点
    let nodeParent = node.parent
    let nodeBorthers = nodeParent.children
@@ -731,7 +608,7 @@ class Render {
    }
    let isAppointNodes = appointNodes.length > 0
    let list = isAppointNodes ? appointNodes : this.activeNodeList
-    let root = list.find(node => {
+    let root = list.find((node) => {
      return node.isRoot
    })
    if (root) {
@@ -804,11 +681,11 @@ class Render {
    if (node.isRoot) {
      return
    }
-    // let copyData = copyNodeTree({}, node, false, true)
+    let copyData = copyNodeTree({}, node, false, true)
    this.removeActiveNode(node)
    this.removeOneNode(node)
    this.mindMap.emit('node_active', null, this.activeNodeList)
-    toNode.nodeData.children.push(node.nodeData)
+    toNode.nodeData.children.push(copyData)
    this.mindMap.render()
    if (toNode.isRoot) {
      toNode.destroy()
@@ -817,7 +694,7 @@ class Render {

  //   粘贴节点到节点
  pasteNode(data) {
-    if (this.activeNodeList.length <= 0 || !data) {
+    if (this.activeNodeList.length <= 0) {
      return
    }
    this.activeNodeList.forEach(item => {
@@ -972,23 +849,21 @@ class Render {
  }

  //  设置节点文本
-  setNodeText(node, text, richText, resetRichText) {
+  setNodeText(node, text, richText) {
    this.setNodeDataRender(node, {
      text,
-      richText,
-      resetRichText
+      richText
    })
  }

  //  设置节点图片
-  setNodeImage(node, { url, title, width, height, custom = false }) {
+  setNodeImage(node, { url, title, width, height }) {
    this.setNodeDataRender(node, {
      image: url,
      imageTitle: title || '',
      imageSize: {
        width,
-        height,
-        custom
+        height
      }
    })
  }
@@ -1101,20 +976,6 @@ class Render {
    })
  }

-  // 定位到指定节点
-  goTargetNode(node, callback = () => {}) {
-    let uid = typeof node === 'string' ? node : node.nodeData.data.uid
-    if (!uid) return
-    this.expandToNodeUid(uid, () => {
-      let targetNode = this.findNodeByUid(uid)
-      if (targetNode) {
-        targetNode.active()
-        this.moveNodeToCenter(targetNode)
-        callback()
-      }
-    })
-  }
-
  //  更新节点数据
  setNodeData(node, data) {
    Object.keys(data).forEach(key => {
@@ -1123,7 +984,7 @@ class Render {
  }

  //  设置节点数据，并判断是否渲染
-  setNodeDataRender(node, data, notRender = false) {
+  setNodeDataRender(node, data) {
    this.setNodeData(node, data)
    let changed = node.reRender()
    if (changed) {
@@ -1131,7 +992,7 @@ class Render {
        // 概要节点
        node.generalizationBelongNode.updateGeneralization()
      }
-      if (!notRender) this.mindMap.render()
+      this.mindMap.render()
    }
  }

@@ -1151,44 +1012,6 @@ class Render {
    this.mindMap.view.translateY(offsetY)
    this.mindMap.view.setScale(1)
  }
-
-  // 展开到指定uid的节点
-  expandToNodeUid(uid, callback = () => {}) {
-    let parentsList = []
-    const cache = {}
-    bfsWalk(this.renderTree, (node, parent) => {
-      if (node.data.uid === uid) {
-        parentsList = parent ? [...cache[parent.data.uid], parent] : []
-        return 'stop'
-      } else {
-        cache[node.data.uid] = parent ? [...cache[parent.data.uid], parent] : []
-      }
-    })
-    let needRender = false
-    parentsList.forEach(node => {
-      if (!node.data.expand) {
-        needRender = true
-        node.data.expand = true
-      }
-    })
-    if (needRender) {
-      this.mindMap.render(callback)
-    } else {
-      callback()
-    }
-  }
-
-  // 根据uid找到对应的节点实例
-  findNodeByUid(uid) {
-    let res = null
-    walk(this.root, null, node => {
-      if (node.nodeData.data.uid === uid) {
-        res = node
-        return true
-      }
-    })
-    return res
-  }
 }

 export default Render
--- a/simple-mind-map/src/plugins/RichText.js
+++ b/simple-mind-map/src/plugins/RichText.js
@@ -1,8 +1,8 @@
 import Quill from 'quill'
 import 'quill/dist/quill.snow.css'
 import html2canvas from 'html2canvas'
-import { walk, getTextFromHtml } from '../utils'
-import { CONSTANTS } from '../constants/constant'
+import { walk, getTextFromHtml } from './utils'
+import { CONSTANTS } from './utils/constant'

 let extended = false

@@ -28,7 +28,7 @@ let fontSizeList = new Array(100).fill(0).map((_, index) => {
  return index + 'px'
 })

-// 富文本编辑插件
+// 节点支持富文本编辑功能
 class RichText {
  constructor({ mindMap, pluginOpt }) {
    this.mindMap = mindMap
@@ -39,15 +39,11 @@ class RichText {
    this.range = null
    this.lastRange = null
    this.node = null
-    this.isInserting = false
    this.styleEl = null
    this.cacheEditingText = ''
-    this.lostStyle = false
-    this.isCompositing = false
    this.initOpt()
    this.extendQuill()
    this.appendCss()
-    this.bindEvent()

    // 处理数据，转成富文本格式
    if (this.mindMap.opt.data) {
@@ -55,20 +51,6 @@ class RichText {
    }
  }

-  // 绑定事件
-  bindEvent() {
-    this.onCompositionStart = this.onCompositionStart.bind(this)
-    this.onCompositionEnd = this.onCompositionEnd.bind(this)
-    window.addEventListener('compositionstart', this.onCompositionStart)
-    window.addEventListener('compositionend', this.onCompositionEnd)
-  }
-
-  // 解绑事件
-  unbindEvent() {
-    window.removeEventListener('compositionstart', this.onCompositionStart)
-    window.removeEventListener('compositionend', this.onCompositionEnd)
-  }
-
  // 插入样式
  appendCss() {
    let cssText = `
@@ -77,7 +59,6 @@ class RichText {
        padding: 0;
        height: auto;
        line-height: normal;
-        -webkit-user-select: text;
      }
      
      .ql-container {
@@ -146,12 +127,11 @@ class RichText {
  }

  // 显示文本编辑控件
-  showEditText(node, rect, isInserting) {
+  showEditText(node, rect) {
    if (this.showTextEdit) {
      return
    }
    this.node = node
-    this.isInserting = isInserting
    if (!rect) rect = node._textData.node.node.getBoundingClientRect()
    this.mindMap.emit('before_show_text_edit')
    this.mindMap.renderer.textEdit.registerTmpShortcut()
@@ -179,15 +159,13 @@ class RichText {
    this.textEditNode.style.marginLeft = `-${paddingX * scaleX}px`
    this.textEditNode.style.marginTop = `-${paddingY * scaleY}px`
    this.textEditNode.style.zIndex = this.mindMap.opt.nodeTextEditZIndex
-    this.textEditNode.style.backgroundColor =
-      bgColor === 'transparent' ? '#fff' : bgColor
+    this.textEditNode.style.backgroundColor = bgColor === 'transparent' ? '#fff' : bgColor
    this.textEditNode.style.minWidth = originWidth + paddingX * 2 + 'px'
    this.textEditNode.style.minHeight = originHeight + 'px'
    this.textEditNode.style.left = rect.left + 'px'
    this.textEditNode.style.top = rect.top + 'px'
    this.textEditNode.style.display = 'block'
-    this.textEditNode.style.maxWidth =
-      this.mindMap.opt.textAutoWrapWidth + paddingX * 2 + 'px'
+    this.textEditNode.style.maxWidth = this.mindMap.opt.textAutoWrapWidth + paddingX * 2 + 'px'
    this.textEditNode.style.transform = `scale(${scaleX}, ${scaleY})`
    this.textEditNode.style.transformOrigin = 'left top'
    if (!node.nodeData.data.richText) {
@@ -196,14 +174,12 @@ class RichText {
      let html = `<p>${text}</p>`
      this.textEditNode.innerHTML = this.cacheEditingText || html
    } else {
-      this.textEditNode.innerHTML =
-        this.cacheEditingText || node.nodeData.data.text
+      this.textEditNode.innerHTML = this.cacheEditingText || node.nodeData.data.text
    }
    this.initQuillEditor()
    document.querySelector('.ql-editor').style.minHeight = originHeight + 'px'
    this.showTextEdit = true
-    // 如果是刚创建的节点，那么默认全选，否则普通激活不全选
-    this.focus(isInserting ? 0 : null)
+    this.focus()
    if (!node.nodeData.data.richText) {
      // 如果是非富文本的情况，需要手动应用文本样式
      this.setTextStyleIfNotRichText(node)
@@ -222,7 +198,7 @@ class RichText {
      underline: node.style.merge('textDecoration') === 'underline',
      strike: node.style.merge('textDecoration') === 'line-through'
    }
-    this.pureFormatAllText(style)
+    this.formatAllText(style)
  }

  // 获取当前正在编辑的内容
@@ -238,8 +214,7 @@ class RichText {
      return
    }
    let html = this.getEditText()
-    let list =
-      nodes && nodes.length > 0 ? nodes : this.mindMap.renderer.activeNodeList
+    let list = nodes && nodes.length > 0 ? nodes : this.mindMap.renderer.activeNodeList
    list.forEach(node => {
      this.mindMap.execCommand('SET_NODE_TEXT', node, html, true)
      if (node.isGeneralization) {
@@ -248,12 +223,15 @@ class RichText {
      }
      this.mindMap.render()
    })
-    this.mindMap.emit('hide_text_edit', this.textEditNode, list)
+    this.mindMap.emit(
+      'hide_text_edit',
+      this.textEditNode,
+      list
+    )
    this.textEditNode.style.display = 'none'
    this.showTextEdit = false
    this.mindMap.emit('rich_text_selection_change', false)
    this.node = null
-    this.isInserting = false
  }

  // 初始化Quill富文本编辑器
@@ -268,12 +246,6 @@ class RichText {
              handler: function () {
                // 覆盖默认的回车键换行
              }
-            },
-            tab: {
-              key: 9,
-              handler: function () {
-                // 覆盖默认的tab键
-              }
            }
          }
        }
@@ -281,8 +253,6 @@ class RichText {
      theme: 'snow'
    })
    this.quill.on('selection-change', range => {
-      // 刚创建的节点全选不需要显示操作条
-      if (this.isInserting) return
      this.lastRange = this.range
      this.range = null
      if (range) {
@@ -311,37 +281,6 @@ class RichText {
        )
      }
    })
-    this.quill.on('text-change', () => {
-      let contents = this.quill.getContents()
-      let len = contents.ops.length
-      // 如果编辑过程中删除所有字符，那么会丢失主题的样式
-      if (len <= 0 || (len === 1 && contents.ops[0].insert === '\n')) {
-        this.lostStyle = true
-        // 需要删除节点的样式数据
-        this.syncFormatToNodeConfig(null, true)
-      } else if (this.lostStyle && !this.isCompositing) {
-        // 如果处于样式丢失状态，那么需要进行格式化加回样式
-        this.setTextStyleIfNotRichText(this.node)
-        this.lostStyle = false
-      }
-    })
-  }
-
-  // 正则输入中文
-  onCompositionStart() {
-    if (!this.showTextEdit) {
-      return
-    }
-    this.isCompositing = true
-  }
-
-  // 中文输入结束
-  onCompositionEnd() {
-    if (!this.showTextEdit || !this.lostStyle) {
-      return
-    }
-    this.isCompositing = false
-    this.setTextStyleIfNotRichText(this.node)
  }

  // 选中全部
@@ -350,9 +289,9 @@ class RichText {
  }

  // 聚焦
-  focus(start) {
+  focus() {
    let len = this.quill.getLength()
-    this.quill.setSelection(typeof start === 'number' ? start : len, len)
+    this.quill.setSelection(len, len)
  }

  // 格式化当前选中的文本
@@ -361,9 +300,7 @@ class RichText {
    this.syncFormatToNodeConfig(config, clear)
    let rangeLost = !this.range
    let range = rangeLost ? this.lastRange : this.range
-    clear
-      ? this.quill.removeFormat(range.index, range.length)
-      : this.quill.formatText(range.index, range.length, config)
+    clear ? this.quill.removeFormat(range.index, range.length) : this.quill.formatText(range.index, range.length, config)
    if (rangeLost) {
      this.quill.setSelection(this.lastRange.index, this.lastRange.length)
    }
@@ -384,11 +321,6 @@ class RichText {
  // 格式化所有文本
  formatAllText(config = {}) {
    this.syncFormatToNodeConfig(config)
-    this.pureFormatAllText(config)
-  }
-
-  // 纯粹的格式化所有文本
-  pureFormatAllText(config = {}) {
    this.quill.formatText(0, this.quill.getLength(), config)
  }

@@ -397,14 +329,7 @@ class RichText {
    if (!this.node) return
    if (clear) {
      // 清除文本样式
-      ;[
-        'fontFamily',
-        'fontSize',
-        'fontWeight',
-        'fontStyle',
-        'textDecoration',
-        'color'
-      ].forEach(prop => {
+      ['fontFamily', 'fontSize', 'fontWeight', 'fontStyle', 'textDecoration', 'color'].forEach((prop) => {
        delete this.node.nodeData.data[prop]
      })
    } else {
@@ -487,11 +412,11 @@ class RichText {
    el.appendChild(node)
    this.mindMap.el.appendChild(el)
    // 遍历所有节点，将它们的margin和padding设为0
-    let walk = root => {
+    let walk = (root) => {
      root.style.margin = 0
      root.style.padding = 0
      if (root.hasChildNodes()) {
-        Array.from(root.children).forEach(item => {
+        Array.from(root.children).forEach((item) => {
          walk(item)
        })
      }
@@ -529,13 +454,13 @@ class RichText {

  // 处理导入数据
  handleSetData(data) {
-    let walk = root => {
+    let walk = (root) => {
      if (!root.data.richText) {
        root.data.richText = true
        root.data.resetRichText = true
      }
      if (root.children && root.children.length > 0) {
-        Array.from(root.children).forEach(item => {
+        Array.from(root.children).forEach((item) => {
          walk(item)
        })
      }
--- a/simple-mind-map/src/plugins/Select.js
+++ b/simple-mind-map/src/plugins/Select.js
@@ -1,6 +1,7 @@
-import { bfsWalk, throttle } from '../utils'
+import { bfsWalk, throttle } from './utils'
+
+//  选择节点类

-// 节点选择插件
 class Select {
  //  构造函数
  constructor({ mindMap }) {
@@ -21,14 +22,9 @@ class Select {
      if (this.mindMap.opt.readonly) {
        return
      }
-      let { useLeftKeySelectionRightKeyDrag } = this.mindMap.opt
-      if (
-        !e.ctrlKey &&
-        (useLeftKeySelectionRightKeyDrag ? e.which !== 1 : e.which !== 3)
-      ) {
+      if (!e.ctrlKey && e.which !== 3) {
        return
      }
-      e.preventDefault()
      this.isMousedown = true
      let { x, y } = this.mindMap.toPos(e.clientX, e.clientY)
      this.mouseDownX = x
@@ -150,24 +146,25 @@ class Select {
      let bottom = (top + height) * scaleY + translateY
      left = left * scaleX + translateX
      top = top * scaleY + translateY
-      if (
-        ((left >= minx && left <= maxx) || (right >= minx && right <= maxx)) &&
-        ((top >= miny && top <= maxy) || (bottom >= miny && bottom <= maxy))
-      ) {
+      if ((left >= minx && left <= maxx ||
+          right >= minx && right <= maxx) && 
+          (top >= miny && top <= maxy ||
+          bottom >= miny && bottom <= maxy)
+        ) {
        // this.mindMap.batchExecution.push('activeNode' + node.uid, () => {
-        if (node.nodeData.data.isActive) {
-          return
-        }
-        this.mindMap.renderer.setNodeActive(node, true)
-        this.mindMap.renderer.addActiveNode(node)
+          if (node.nodeData.data.isActive) {
+            return
+          }
+          this.mindMap.renderer.setNodeActive(node, true)
+          this.mindMap.renderer.addActiveNode(node)
        // })
      } else if (node.nodeData.data.isActive) {
        // this.mindMap.batchExecution.push('activeNode' + node.uid, () => {
-        if (!node.nodeData.data.isActive) {
-          return
-        }
-        this.mindMap.renderer.setNodeActive(node, false)
-        this.mindMap.renderer.removeActiveNode(node)
+          if (!node.nodeData.data.isActive) {
+            return
+          }
+          this.mindMap.renderer.setNodeActive(node, false)
+          this.mindMap.renderer.removeActiveNode(node)
        // })
      }
    })
--- a/simple-mind-map/src/core/render/node/Shape.js
+++ b/simple-mind-map/src/core/render/node/Shape.js
@@ -1,5 +1,5 @@
 import { Rect, Polygon, Path } from '@svgdotjs/svg.js'
-import { CONSTANTS } from '../../../constants/constant'
+import { CONSTANTS } from './utils/constant'

 //  节点形状类
 export default class Shape {
--- a/simple-mind-map/src/core/render/node/Style.js
+++ b/simple-mind-map/src/core/render/node/Style.js
@@ -1,20 +1,10 @@
-import { tagColorList, nodeDataNoStylePropList } from '../../../constants/constant'
+import { tagColorList } from './utils/constant'
 const rootProp = ['paddingX', 'paddingY']
-const backgroundStyleProps = ['backgroundColor', 'backgroundImage', 'backgroundRepeat', 'backgroundPosition', 'backgroundSize']

 //  样式类
 class Style {
  //   设置背景样式
  static setBackgroundStyle(el, themeConfig) {
-    // 缓存容器元素原本的样式
-    if (!Style.cacheStyle) {
-      Style.cacheStyle = {}
-      let style = window.getComputedStyle(el)
-      backgroundStyleProps.forEach((prop) => {
-        Style.cacheStyle[prop] = style[prop]
-      })
-    }
-    // 设置新样式
    let { backgroundColor, backgroundImage, backgroundRepeat, backgroundPosition, backgroundSize } = themeConfig
    el.style.backgroundColor = backgroundColor
    if (backgroundImage) {
@@ -27,15 +17,6 @@ class Style {
    }
  }

-  // 移除背景样式
-  static removeBackgroundStyle(el) {
-    if (!Style.cacheStyle) return
-    backgroundStyleProps.forEach((prop) => {
-      el.style[prop] = Style.cacheStyle[prop]
-    })
-    Style.cacheStyle = null
-  }
-
  //  构造函数
  constructor(ctx) {
    this.ctx = ctx
@@ -209,19 +190,6 @@ class Style {
    node2.fill({ color: color })
    fillNode.fill({ color: fill })
  }
-
-  // 是否设置了自定义的样式
-  hasCustomStyle() {
-    let res = false
-    Object.keys(this.ctx.nodeData.data).forEach((item) => {
-      if (!nodeDataNoStylePropList.includes(item)) {
-        res = true
-      }
-    })
-    return res
-  }
 }

-Style.cacheStyle = null
-
 export default Style
--- a/simple-mind-map/src/core/render/TextEdit.js
+++ b/simple-mind-map/src/core/render/TextEdit.js
@@ -1,4 +1,4 @@
-import { getStrWithBrFromHtml, checkNodeOuter } from '../../utils'
+import { getStrWithBrFromHtml, checkNodeOuter } from './utils'

 //  节点文字编辑类
 export default class TextEdit {
@@ -10,14 +10,11 @@ export default class TextEdit {
    this.currentNode = null
    // 文本编辑框
    this.textEditNode = null
-    // 隐藏的文本输入框
-    this.hiddenInputEl = null
    // 文本编辑框是否显示
    this.showTextEdit = false
    // 如果编辑过程中缩放画布了，那么缓存当前编辑的内容
    this.cacheEditingText = ''
    this.bindEvent()
-    this.createHiddenInput()
  }

  //  事件
@@ -49,10 +46,6 @@ export default class TextEdit {
    this.mindMap.on('before_node_active', () => {
      this.hideEditTextBox()
    })
-    // 节点激活事件
-    this.mindMap.on('node_active', () => {
-      this.focusHiddenInput()
-    })
    // 注册编辑快捷键
    this.mindMap.keyCommand.addShortcut('F2', () => {
      if (this.renderer.activeNodeList.length <= 0) {
@@ -63,77 +56,22 @@ export default class TextEdit {
    this.mindMap.on('scale', this.onScale)
  }

-  // 创建一个隐藏的文本输入框
-  createHiddenInput() {
-    if (this.hiddenInputEl) return
-    this.hiddenInputEl = document.createElement('input')
-    this.hiddenInputEl.type = 'text'
-    this.hiddenInputEl.style.cssText = `
-      position: fixed;
-      left: -99999px;
-      top: -99999px;
-    `
-    // 监听粘贴事件
-    this.hiddenInputEl.addEventListener('paste', async event => {
-      event.preventDefault()
-      const text = (event.clipboardData || window.clipboardData).getData('text')
-      const files = event.clipboardData.files
-      let img = null
-      if (files.length > 0) {
-        for (let i = 0; i < files.length; i++) {
-          if (/^image\//.test(files[i].type)) {
-            img = files[i]
-            break
-          }
-        }
-      }
-      this.mindMap.emit('paste', {
-        text,
-        img
-      })
-    })
-    document.body.appendChild(this.hiddenInputEl)
-  }
-
-  // 让隐藏的文本输入框聚焦
-  focusHiddenInput() {
-    if (this.hiddenInputEl) this.hiddenInputEl.focus()
-  }
-
  //  注册临时快捷键
  registerTmpShortcut() {
    // 注册回车快捷键
    this.mindMap.keyCommand.addShortcut('Enter', () => {
      this.hideEditTextBox()
    })
-    this.mindMap.keyCommand.addShortcut('Tab', () => {
-      this.hideEditTextBox()
-    })
  }

  //  显示文本编辑框
-  // isInserting：是否是刚创建的节点
-  async show(node, e, isInserting = false) {
-    // 使用了自定义节点内容那么不响应编辑事件
-    if (node.isUseCustomNodeContent()) {
-      return
-    }
-    let { beforeTextEdit } = this.mindMap.opt
-    if (typeof beforeTextEdit === 'function') {
-      let isShow = false
-      try {
-        isShow = await beforeTextEdit(node, isInserting)
-      } catch (error) {
-        isShow = false
-      }
-      if (!isShow) return
-    }
+  show(node) {
    this.currentNode = node
    let { offsetLeft, offsetTop } = checkNodeOuter(this.mindMap, node)
    this.mindMap.view.translateXY(offsetLeft, offsetTop)
    let rect = node._textData.node.node.getBoundingClientRect()
    if (this.mindMap.richText) {
-      this.mindMap.richText.showEditText(node, rect, isInserting)
+      this.mindMap.richText.showEditText(node, rect)
      return
    }
    this.showEditTextBox(node, rect)
@@ -143,8 +81,7 @@ export default class TextEdit {
  onScale() {
    if (!this.currentNode) return
    if (this.mindMap.richText) {
-      this.mindMap.richText.cacheEditingText =
-        this.mindMap.richText.getEditText()
+      this.mindMap.richText.cacheEditingText = this.mindMap.richText.getEditText()
      this.mindMap.richText.showTextEdit = false
    } else {
      this.cacheEditingText = this.getEditText()
@@ -172,9 +109,7 @@ export default class TextEdit {
    let scale = this.mindMap.view.scale
    let lineHeight = node.style.merge('lineHeight')
    let fontSize = node.style.merge('fontSize')
-    let textLines = (this.cacheEditingText || node.nodeData.data.text).split(
-      /\n/gim
-    )
+    let textLines = (this.cacheEditingText || node.nodeData.data.text).split(/\n/gim)
    let isMultiLine = node._textData.node.attr('data-ismultiLine') === 'true'
    node.style.domText(this.textEditNode, scale, isMultiLine)
    this.textEditNode.style.zIndex = this.mindMap.opt.nodeTextEditZIndex
@@ -184,12 +119,9 @@ export default class TextEdit {
    this.textEditNode.style.left = rect.left + 'px'
    this.textEditNode.style.top = rect.top + 'px'
    this.textEditNode.style.display = 'block'
-    this.textEditNode.style.maxWidth =
-      this.mindMap.opt.textAutoWrapWidth * scale + 'px'
+    this.textEditNode.style.maxWidth = this.mindMap.opt.textAutoWrapWidth * scale + 'px'
    if (isMultiLine && lineHeight !== 1) {
-      this.textEditNode.style.transform = `translateY(${
-        -((lineHeight * fontSize - fontSize) / 2) * scale
-      }px)`
+      this.textEditNode.style.transform = `translateY(${-((lineHeight * fontSize - fontSize) / 2) * scale}px)`
    }
    this.showTextEdit = true
    // 选中文本
--- a/simple-mind-map/src/View.js
+++ b/simple-mind-map/src/View.js
@@ -0,0 +1,206 @@
+import { CONSTANTS } from './utils/constant'
+
+//  视图操作类
+class View {
+  //  构造函数
+  constructor(opt = {}) {
+    this.opt = opt
+    this.mindMap = this.opt.mindMap
+    this.scale = 1
+    this.sx = 0
+    this.sy = 0
+    this.x = 0
+    this.y = 0
+    this.firstDrag = true
+    this.setTransformData(this.mindMap.opt.viewData)
+    this.bind()
+  }
+
+  //  绑定
+  bind() {
+    // 快捷键
+    this.mindMap.keyCommand.addShortcut('Control+=', () => {
+      this.enlarge()
+    })
+    this.mindMap.keyCommand.addShortcut('Control+-', () => {
+      this.narrow()
+    })
+    this.mindMap.keyCommand.addShortcut('Control+Enter', () => {
+      this.reset()
+    })
+    this.mindMap.svg.on('dblclick', () => {
+      this.reset()
+    })
+    // 拖动视图
+    this.mindMap.event.on('mousedown', () => {
+      this.sx = this.x
+      this.sy = this.y
+    })
+    this.mindMap.event.on('drag', (e, event) => {
+      if (e.ctrlKey) {
+        // 按住ctrl键拖动为多选
+        return
+      }
+      if (this.firstDrag) {
+        this.firstDrag = false
+        // 清除激活节点
+        if (this.mindMap.renderer.activeNodeList.length > 0) {
+          this.mindMap.execCommand('CLEAR_ACTIVE_NODE')
+        }
+      }
+      this.x = this.sx + event.mousemoveOffset.x
+      this.y = this.sy + event.mousemoveOffset.y
+      this.transform()
+    })
+    this.mindMap.event.on('mouseup', () => {
+      this.firstDrag = true
+    })
+    // 放大缩小视图
+    this.mindMap.event.on('mousewheel', (e, dir) => {
+      if (this.mindMap.opt.customHandleMousewheel && typeof this.mindMap.opt.customHandleMousewheel === 'function') {
+        return this.mindMap.opt.customHandleMousewheel(e)
+      }
+      if (this.mindMap.opt.mousewheelAction === CONSTANTS.MOUSE_WHEEL_ACTION.ZOOM) {
+        switch (dir) {
+          // 鼠标滚轮，向上和向左，都是缩小
+          case CONSTANTS.DIR.UP:
+          case CONSTANTS.DIR.LEFT:
+            this.narrow()
+            break
+          // 鼠标滚轮，向下和向右，都是放大
+          case CONSTANTS.DIR.DOWN:
+          case CONSTANTS.DIR.RIGHT:
+            this.enlarge()
+            break
+        }
+      } else {
+        switch (dir){
+          // 上移
+          case CONSTANTS.DIR.DOWN:
+            this.translateY(-this.mindMap.opt.mousewheelMoveStep)
+            break
+          // 下移
+          case CONSTANTS.DIR.UP:
+            this.translateY(this.mindMap.opt.mousewheelMoveStep)
+            break
+          // 右移
+          case CONSTANTS.DIR.LEFT:
+            this.translateX(-this.mindMap.opt.mousewheelMoveStep)
+            break
+          // 左移
+          case CONSTANTS.DIR.RIGHT:
+            this.translateX(this.mindMap.opt.mousewheelMoveStep)
+            break
+        }
+      }
+    })
+  }
+
+  //  获取当前变换状态数据
+  getTransformData() {
+    return {
+      transform: this.mindMap.draw.transform(),
+      state: {
+        scale: this.scale,
+        x: this.x,
+        y: this.y,
+        sx: this.sx,
+        sy: this.sy
+      }
+    }
+  }
+
+  //  动态设置变换状态数据
+  setTransformData(viewData) {
+    if (viewData) {
+      Object.keys(viewData.state).forEach(prop => {
+        this[prop] = viewData.state[prop]
+      })
+      this.mindMap.draw.transform({
+        ...viewData.transform
+      })
+      this.mindMap.emit('view_data_change', this.getTransformData())
+      this.mindMap.emit('scale', this.scale)
+    }
+  }
+
+  //  平移x,y方向
+  translateXY(x, y) {
+    this.x += x
+    this.y += y
+    this.transform()
+  }
+
+  //  平移x方向
+  translateX(step) {
+    this.x += step
+    this.transform()
+  }
+
+  //  平移x方式到
+  translateXTo(x) {
+    this.x = x
+    this.transform()
+  }
+
+  //  平移y方向
+  translateY(step) {
+    this.y += step
+    this.transform()
+  }
+
+  //  平移y方向到
+  translateYTo(y) {
+    this.y = y
+    this.transform()
+  }
+
+  //   应用变换
+  transform() {
+    this.mindMap.draw.transform({
+      scale: this.scale,
+      // origin: 'center center',
+      translate: [this.x, this.y]
+    })
+    this.mindMap.emit('view_data_change', this.getTransformData())
+  }
+
+  //  恢复
+  reset() {
+    let scaleChange = this.scale !== 1
+    this.scale = 1
+    this.x = 0
+    this.y = 0
+    this.transform()
+    if (scaleChange) {
+      this.mindMap.emit('scale', this.scale)
+    }
+  }
+
+  //  缩小
+  narrow() {
+    if (this.scale - this.mindMap.opt.scaleRatio > 0.1) {
+      this.scale -= this.mindMap.opt.scaleRatio
+    } else {
+      this.scale = 0.1
+    }
+    this.transform()
+    this.mindMap.emit('scale', this.scale)
+  }
+
+  //  放大
+  enlarge() {
+    this.scale += this.mindMap.opt.scaleRatio
+    this.transform()
+    this.mindMap.emit('scale', this.scale)
+  }
+
+  //  设置缩放
+  setScale(scale) {
+    this.scale = scale
+    this.transform()
+    this.mindMap.emit('scale', this.scale)
+  }
+}
+
+export default View
--- a/simple-mind-map/src/plugins/Watermark.js
+++ b/simple-mind-map/src/plugins/Watermark.js
@@ -1,8 +1,8 @@
 import { Text, G } from '@svgdotjs/svg.js'
-import { degToRad, camelCaseToHyphen } from '../utils'
+import { degToRad, camelCaseToHyphen } from './utils'
 import merge from 'deepmerge'

-// 水印插件
+// 水印类
 class Watermark {
  constructor(opt = {}) {
    this.mindMap = opt.mindMap
--- a/simple-mind-map/src/constants/defaultOptions.js
+++ b/simple-mind-map/src/constants/defaultOptions.js
@@ -1,126 +0,0 @@
-import { CONSTANTS } from './constant'
-
-// 默认选项配置
-export const defaultOpt = {
-  // 是否只读
-  readonly: false,
-  // 布局
-  layout: CONSTANTS.LAYOUT.LOGICAL_STRUCTURE,
-  // 如果结构为鱼骨图，那么可以通过该选项控制倾斜角度
-  fishboneDeg: 45,
-  // 主题
-  theme: 'default', // 内置主题：default（默认主题）
-  // 主题配置，会和所选择的主题进行合并
-  themeConfig: {},
-  // 放大缩小的增量比例
-  scaleRatio: 0.2,
-  // 鼠标缩放是否以鼠标当前位置为中心点，否则以画布中心点
-  mouseScaleCenterUseMousePosition: true,
-  // 最多显示几个标签
-  maxTag: 5,
-  // 导出图片时的内边距
-  exportPadding: 20,
-  // 展开收缩按钮尺寸
-  expandBtnSize: 20,
-  // 节点里图片和文字的间距
-  imgTextMargin: 5,
-  // 节点里各种文字信息的间距，如图标和文字的间距
-  textContentMargin: 2,
-  // 多选节点时鼠标移动到边缘时的画布移动偏移量
-  selectTranslateStep: 3,
-  // 多选节点时鼠标移动距边缘多少距离时开始偏移
-  selectTranslateLimit: 20,
-  // 自定义节点备注内容显示
-  customNoteContentShow: null,
-  /*
-          {
-              show(){},
-              hide(){}
-          }
-      */
-  // 是否开启节点自由拖拽
-  enableFreeDrag: false,
-  // 水印配置
-  watermarkConfig: {
-    text: '',
-    lineSpacing: 100,
-    textSpacing: 100,
-    angle: 30,
-    textStyle: {
-      color: '#999',
-      opacity: 0.5,
-      fontSize: 14
-    }
-  },
-  // 达到该宽度文本自动换行
-  textAutoWrapWidth: 500,
-  // 自定义鼠标滚轮事件处理
-  // 可以传一个函数，回调参数为事件对象
-  customHandleMousewheel: null,
-  // 鼠标滚动的行为，如果customHandleMousewheel传了自定义函数，这个属性不生效
-  mousewheelAction: CONSTANTS.MOUSE_WHEEL_ACTION.ZOOM, // zoom（放大缩小）、move（上下移动）
-  // 当mousewheelAction设为move时，可以通过该属性控制鼠标滚动一下视图移动的步长，单位px
-  mousewheelMoveStep: 100,
-  // 当mousewheelAction设为zoom时，默认向前滚动是缩小，向后滚动是放大，如果该属性设为true，那么会反过来
-  mousewheelZoomActionReverse: false,
-  // 默认插入的二级节点的文字
-  defaultInsertSecondLevelNodeText: '二级节点',
-  // 默认插入的二级以下节点的文字
-  defaultInsertBelowSecondLevelNodeText: '分支主题',
-  // 展开收起按钮的颜色
-  expandBtnStyle: {
-    color: '#808080',
-    fill: '#fff'
-  },
-  // 自定义展开收起按钮的图标
-  expandBtnIcon: {
-    open: '', // svg字符串
-    close: ''
-  },
-  // 是否只有当鼠标在画布内才响应快捷键事件
-  enableShortcutOnlyWhenMouseInSvg: true,
-  // 初始根节点的位置
-  initRootNodePosition: null,
-  // 导出png、svg、pdf时的图形内边距
-  exportPaddingX: 10,
-  exportPaddingY: 10,
-  // 节点文本编辑框的z-index
-  nodeTextEditZIndex: 3000,
-  // 节点备注浮层的z-index
-  nodeNoteTooltipZIndex: 3000,
-  // 是否在点击了画布外的区域时结束节点文本的编辑状态
-  isEndNodeTextEditOnClickOuter: true,
-  // 最大历史记录数
-  maxHistoryCount: 1000,
-  // 是否一直显示节点的展开收起按钮，默认为鼠标移上去和激活时才显示
-  alwaysShowExpandBtn: false,
-  // 扩展节点可插入的图标
-  iconList: [
-    // {
-    //   name: '',// 分组名称
-    //   type: '',// 分组的值
-    //   list: [// 分组下的图标列表
-    //     {
-    //       name: '',// 图标名称
-    //       icon:''// 图标，可以传svg或图片
-    //     }
-    //   ]
-    // }
-  ],
-  // 节点最大缓存数量
-  maxNodeCacheCount: 1000,
-  // 关联线默认文字
-  defaultAssociativeLineText: '关联',
-  // 思维导图适应画布大小时的内边距
-  fitPadding: 50,
-  // 是否开启按住ctrl键多选节点功能
-  enableCtrlKeyNodeSelection: true,
-  // 设置为左键多选节点，右键拖动画布
-  useLeftKeySelectionRightKeyDrag: false,
-  // 节点即将进入编辑前的回调方法，如果该方法返回true以外的值，那么将取消编辑，函数可以返回一个值，或一个Promise，回调参数为节点实例
-  beforeTextEdit: null,
-  // 是否开启自定义节点内容
-  isUseCustomNodeContent: false,
-  // 自定义返回节点内容的方法
-  customCreateNodeContent: null
-}
--- a/simple-mind-map/src/core/view/View.js
+++ b/simple-mind-map/src/core/view/View.js
@@ -1,296 +0,0 @@
-import { CONSTANTS } from '../../constants/constant'
-
-//  视图操作类
-class View {
-  //  构造函数
-  constructor(opt = {}) {
-    this.opt = opt
-    this.mindMap = this.opt.mindMap
-    this.scale = 1
-    this.sx = 0
-    this.sy = 0
-    this.x = 0
-    this.y = 0
-    this.firstDrag = true
-    this.setTransformData(this.mindMap.opt.viewData)
-    this.bind()
-  }
-
-  //  绑定
-  bind() {
-    // 快捷键
-    this.mindMap.keyCommand.addShortcut('Control+=', () => {
-      this.enlarge()
-    })
-    this.mindMap.keyCommand.addShortcut('Control+-', () => {
-      this.narrow()
-    })
-    this.mindMap.keyCommand.addShortcut('Control+Enter', () => {
-      this.reset()
-    })
-    this.mindMap.keyCommand.addShortcut('Control+i', () => {
-      this.fit()
-    })
-    this.mindMap.svg.on('dblclick', () => {
-      this.reset()
-    })
-    // 拖动视图
-    this.mindMap.event.on('mousedown', () => {
-      this.sx = this.x
-      this.sy = this.y
-    })
-    this.mindMap.event.on('drag', (e, event) => {
-      if (e.ctrlKey) {
-        // 按住ctrl键拖动为多选
-        return
-      }
-      if (this.firstDrag) {
-        this.firstDrag = false
-        // 清除激活节点
-        if (this.mindMap.renderer.activeNodeList.length > 0) {
-          this.mindMap.execCommand('CLEAR_ACTIVE_NODE')
-        }
-      }
-      this.x = this.sx + event.mousemoveOffset.x
-      this.y = this.sy + event.mousemoveOffset.y
-      this.transform()
-    })
-    this.mindMap.event.on('mouseup', () => {
-      this.firstDrag = true
-    })
-    // 放大缩小视图
-    this.mindMap.event.on('mousewheel', (e, dir, event, isTouchPad) => {
-      let {
-        customHandleMousewheel,
-        mousewheelAction,
-        mouseScaleCenterUseMousePosition,
-        mousewheelMoveStep,
-        mousewheelZoomActionReverse
-      } = this.mindMap.opt
-      // 是否自定义鼠标滚轮事件
-      if (
-        customHandleMousewheel &&
-        typeof customHandleMousewheel === 'function'
-      ) {
-        return customHandleMousewheel(e)
-      }
-      // 鼠标滚轮事件控制缩放
-      if (mousewheelAction === CONSTANTS.MOUSE_WHEEL_ACTION.ZOOM) {
-        let cx = mouseScaleCenterUseMousePosition ? e.clientX : undefined
-        let cy = mouseScaleCenterUseMousePosition ? e.clientY : undefined
-        switch (dir) {
-          // 鼠标滚轮，向上和向左，都是缩小
-          case CONSTANTS.DIR.UP:
-          case CONSTANTS.DIR.LEFT:
-            mousewheelZoomActionReverse ? this.enlarge(cx, cy, isTouchPad) : this.narrow(cx, cy, isTouchPad)
-            break
-          // 鼠标滚轮，向下和向右，都是放大
-          case CONSTANTS.DIR.DOWN:
-          case CONSTANTS.DIR.RIGHT:
-            mousewheelZoomActionReverse ? this.narrow(cx, cy, isTouchPad) : this.enlarge(cx, cy, isTouchPad)
-            break
-        }
-      } else {// 鼠标滚轮事件控制画布移动
-        let step = mousewheelMoveStep
-        if (isTouchPad) {
-          step = 5
-        }
-        switch (dir) {
-          // 上移
-          case CONSTANTS.DIR.DOWN:
-            this.translateY(-step)
-            break
-          // 下移
-          case CONSTANTS.DIR.UP:
-            this.translateY(step)
-            break
-          // 右移
-          case CONSTANTS.DIR.LEFT:
-            this.translateX(-step)
-            break
-          // 左移
-          case CONSTANTS.DIR.RIGHT:
-            this.translateX(step)
-            break
-        }
-      }
-    })
-  }
-
-  //  获取当前变换状态数据
-  getTransformData() {
-    return {
-      transform: this.mindMap.draw.transform(),
-      state: {
-        scale: this.scale,
-        x: this.x,
-        y: this.y,
-        sx: this.sx,
-        sy: this.sy
-      }
-    }
-  }
-
-  //  动态设置变换状态数据
-  setTransformData(viewData) {
-    if (viewData) {
-      Object.keys(viewData.state).forEach(prop => {
-        this[prop] = viewData.state[prop]
-      })
-      this.mindMap.draw.transform({
-        ...viewData.transform
-      })
-      this.mindMap.emit('view_data_change', this.getTransformData())
-      this.mindMap.emit('scale', this.scale)
-    }
-  }
-
-  //  平移x,y方向
-  translateXY(x, y) {
-    this.x += x
-    this.y += y
-    this.transform()
-  }
-
-  //  平移x方向
-  translateX(step) {
-    this.x += step
-    this.transform()
-  }
-
-  //  平移x方式到
-  translateXTo(x) {
-    this.x = x
-    this.transform()
-  }
-
-  //  平移y方向
-  translateY(step) {
-    this.y += step
-    this.transform()
-  }
-
-  //  平移y方向到
-  translateYTo(y) {
-    this.y = y
-    this.transform()
-  }
-
-  //   应用变换
-  transform() {
-    this.mindMap.draw.transform({
-      origin: [0, 0],
-      scale: this.scale,
-      translate: [this.x, this.y]
-    })
-    this.mindMap.emit('view_data_change', this.getTransformData())
-  }
-
-  //  恢复
-  reset() {
-    let scaleChange = this.scale !== 1
-    this.scale = 1
-    this.x = 0
-    this.y = 0
-    this.transform()
-    if (scaleChange) {
-      this.mindMap.emit('scale', this.scale)
-    }
-  }
-
-  //  缩小
-  narrow(cx, cy, isTouchPad) {
-    const scaleRatio = this.mindMap.opt.scaleRatio / (isTouchPad ? 5 : 1)
-    const scale = Math.max(this.scale - scaleRatio, 0.1)
-    this.scaleInCenter(scale, cx, cy)
-    this.transform()
-    this.mindMap.emit('scale', this.scale)
-  }
-
-  //  放大
-  enlarge(cx, cy, isTouchPad) {
-    const scaleRatio = this.mindMap.opt.scaleRatio / (isTouchPad ? 5 : 1)
-    const scale = this.scale + scaleRatio
-    this.scaleInCenter(scale, cx, cy)
-    this.transform()
-    this.mindMap.emit('scale', this.scale)
-  }
-
-  // 基于指定中心进行缩放，cx，cy 可不指定，此时会使用画布中心点
-  scaleInCenter(scale, cx, cy) {
-    if (cx === undefined || cy === undefined) {
-      cx = this.mindMap.width / 2
-      cy = this.mindMap.height / 2
-    }
-    const prevScale = this.scale
-    const ratio = 1 - scale / prevScale
-    const dx = (cx - this.x) * ratio
-    const dy = (cy - this.y) * ratio
-    this.x += dx
-    this.y += dy
-    this.scale = scale
-  }
-
-  //  设置缩放
-  setScale(scale, cx, cy) {
-    if (cx !== undefined && cy !== undefined) {
-      this.scaleInCenter(scale, cx, cy)
-    } else {
-      this.scale = scale
-    }
-    this.transform()
-    this.mindMap.emit('scale', this.scale)
-  }
-
-  // 适应画布大小
-  fit() {
-    let { fitPadding } = this.mindMap.opt
-    let draw = this.mindMap.draw
-    let origTransform = draw.transform()
-    let rect = draw.rbox()
-    let drawWidth = rect.width / origTransform.scaleX
-    let drawHeight = rect.height / origTransform.scaleY
-    let drawRatio = drawWidth / drawHeight
-    let { width: elWidth, height: elHeight } =
-      this.mindMap.el.getBoundingClientRect()
-    elWidth = elWidth - fitPadding * 2
-    elHeight = elHeight - fitPadding * 2
-    let elRatio = elWidth / elHeight
-    let newScale = 0
-    let flag = ''
-    if (drawWidth <= elWidth && drawHeight <= elHeight) {
-      newScale = 1
-      flag = 1
-    } else {
-      let newWidth = 0
-      let newHeight = 0
-      if (drawRatio > elRatio) {
-        newWidth = elWidth
-        newHeight = elWidth / drawRatio
-        flag = 2
-      } else {
-        newHeight = elHeight
-        newWidth = elHeight * drawRatio
-        flag = 3
-      }
-      newScale = newWidth / drawWidth
-    }
-    this.setScale(newScale)
-    let newRect = draw.rbox()
-    let newX = 0
-    let newY = 0
-    if (flag === 1) {
-      newX = -newRect.x + fitPadding + (elWidth - newRect.width) / 2
-      newY = -newRect.y + fitPadding + (elHeight - newRect.height) / 2
-    } else if (flag === 2) {
-      newX = -newRect.x + fitPadding
-      newY = -newRect.y + fitPadding + (elHeight - newRect.height) / 2
-    } else if (flag === 3) {
-      newX = -newRect.x + fitPadding + (elWidth - newRect.width) / 2
-      newY = -newRect.y + fitPadding
-    }
-    this.translateXY(newX, newY)
-  }
-}
-
-export default View
--- a/simple-mind-map/src/layouts/Base.js
+++ b/simple-mind-map/src/layouts/Base.js
@@ -1,7 +1,6 @@
-import Node from '../core/render/node/Node'
-import { CONSTANTS, initRootNodePositionMap } from '../constants/constant'
+import Node from '../Node'
+import { CONSTANTS, initRootNodePositionMap } from '../utils/constant'
 import Lru from '../utils/Lru'
-import { createUid } from '../utils/index'

 //  布局基类
 class Base {
@@ -49,20 +48,6 @@ class Base {
    return [CONSTANTS.CHANGE_THEME, CONSTANTS.TRANSFORM_TO_NORMAL_NODE].includes(this.renderer.renderSource)
  }

-  // 层级类型改变
-  checkIsLayerTypeChange(oldIndex, newIndex) {
-    if (oldIndex >= 2 && newIndex >= 2) return false
-    if (oldIndex >= 2 && newIndex < 2) return true
-    if (oldIndex < 2 && newIndex >= 2) return true
-  }
-
-  // 检查是否是结构布局改变重新渲染展开收起按钮占位元素
-  checkIsLayoutChangeRerenderExpandBtnPlaceholderRect(node) {
-    if (this.renderer.renderSource === CONSTANTS.CHANGE_LAYOUT) {
-      node.needRerenderExpandBtnPlaceholderRect = true
-    }
-  }
-
  //  创建节点实例
  createNode(data, parent, isRoot, layerIndex) {
    // 创建节点
@@ -70,13 +55,11 @@ class Base {
    // 数据上保存了节点引用，那么直接复用节点
    if (data && data._node && !this.renderer.reRender) {
      newNode = data._node
-      let isLayerTypeChange = this.checkIsLayerTypeChange(newNode.layerIndex, layerIndex)
      newNode.reset()
      newNode.layerIndex = layerIndex
      this.cacheNode(data._node.uid, newNode)
-      this.checkIsLayoutChangeRerenderExpandBtnPlaceholderRect(newNode)
      // 主题或主题配置改变了需要重新计算节点大小和布局
-      if (this.checkIsNeedResizeSources() || isLayerTypeChange) {
+      if (this.checkIsNeedResizeSources()) {
        newNode.getSize()
        newNode.needLayout = true
      }
@@ -85,24 +68,22 @@ class Base {
      newNode = this.lru.get(data.data.uid)
      // 保存该节点上一次的数据
      let lastData = JSON.stringify(newNode.nodeData.data)
-      let isLayerTypeChange = this.checkIsLayerTypeChange(newNode.layerIndex, layerIndex)
      newNode.reset()
      newNode.nodeData = newNode.handleData(data || {})
      newNode.layerIndex = layerIndex
      this.cacheNode(data.data.uid, newNode)
-      this.checkIsLayoutChangeRerenderExpandBtnPlaceholderRect(newNode)
      data._node = newNode
      // 主题或主题配置改变了需要重新计算节点大小和布局
      let isResizeSource = this.checkIsNeedResizeSources()
      // 节点数据改变了需要重新计算节点大小和布局
      let isNodeDataChange = lastData !== JSON.stringify(data.data)
-      if (isResizeSource || isNodeDataChange || isLayerTypeChange) {
+      if (isResizeSource || isNodeDataChange) {
        newNode.getSize()
        newNode.needLayout = true
      }
    } else {
      // 创建新节点
-      let uid = data.data.uid || createUid()
+      let uid = this.mindMap.uid++
      newNode = new Node({
        data,
        uid,
--- a/simple-mind-map/src/layouts/CatalogOrganization.js
+++ b/simple-mind-map/src/layouts/CatalogOrganization.js
@@ -349,11 +349,6 @@ class CatalogOrganization extends Base {
    gNode.left = right + generalizationNodeMargin
    gNode.top = top + (bottom - top - gNode.height) / 2
  }
-
-  // 渲染展开收起按钮的隐藏占位元素
-  renderExpandBtnRect(rect, expandBtnSize, width, height, node) {
-    rect.size(width, expandBtnSize).x(0).y(height)
-  }
 }

 export default CatalogOrganization
--- a/simple-mind-map/src/layouts/Fishbone.js
+++ b/simple-mind-map/src/layouts/Fishbone.js
@@ -1,6 +1,6 @@
 import Base from './Base'
 import { walk, asyncRun, degToRad } from '../utils'
-import { CONSTANTS } from '../constants/constant'
+import { CONSTANTS } from '../utils/constant'
 import utils from './fishboneUtils'

 //  鱼骨图
@@ -51,8 +51,8 @@ class Fishbone extends Base {
            // 节点生长方向
            newNode.dir =
              index % 2 === 0
-                ? CONSTANTS.LAYOUT_GROW_DIR.TOP
-                : CONSTANTS.LAYOUT_GROW_DIR.BOTTOM
+                ? CONSTANTS.TIMELINE_DIR.TOP
+                : CONSTANTS.TIMELINE_DIR.BOTTOM
          }
          // 计算二级节点的top值
          if (parent._node.isRoot) {
@@ -222,7 +222,7 @@ class Fishbone extends Base {

  // 检查节点是否是上方节点
  checkIsTop(node) {
-    return node.dir === CONSTANTS.LAYOUT_GROW_DIR.TOP
+    return node.dir === CONSTANTS.TIMELINE_DIR.TOP
  }

  //  绘制连线，连接该节点到其子节点
@@ -239,7 +239,7 @@ class Fishbone extends Base {
      // 当前节点是根节点
      // 根节点的子节点是和根节点同一水平线排列
      let maxx = -Infinity
-      node.children.forEach(item => {
+      node.children.forEach((item) => {
        if (item.left > maxx) {
          maxx = item.left
        }
@@ -250,15 +250,15 @@ class Fishbone extends Base {
        let line = this.draw.path()
        if (this.checkIsTop(item)) {
          line.plot(
-            `M ${nodeLineX - offsetX},${item.top + item.height + offset} L ${
-              item.left
-            },${item.top + item.height}`
+            `M ${nodeLineX - offsetX},${item.top + item.height + offset} L ${item.left},${
+              item.top + item.height
+            }`
          )
        } else {
          line.plot(
-            `M ${nodeLineX - offsetX},${item.top - offset} L ${nodeLineX},${
-              item.top
-            }`
+            `M ${nodeLineX - offsetX},${
+              item.top - offset
+            } L ${nodeLineX},${item.top}`
          )
        }
        node.style.line(line)
@@ -373,27 +373,6 @@ class Fishbone extends Base {
    gNode.left = right + generalizationNodeMargin
    gNode.top = top + (bottom - top - gNode.height) / 2
  }
-
-  // 渲染展开收起按钮的隐藏占位元素
-  renderExpandBtnRect(rect, expandBtnSize, width, height, node) {
-    let dir = ''
-    if (node.dir === CONSTANTS.LAYOUT_GROW_DIR.TOP) {
-      dir =
-        node.layerIndex === 1
-          ? CONSTANTS.LAYOUT_GROW_DIR.TOP
-          : CONSTANTS.LAYOUT_GROW_DIR.BOTTOM
-    } else {
-      dir =
-        node.layerIndex === 1
-          ? CONSTANTS.LAYOUT_GROW_DIR.BOTTOM
-          : CONSTANTS.LAYOUT_GROW_DIR.TOP
-    }
-    if (dir === CONSTANTS.LAYOUT_GROW_DIR.TOP) {
-      rect.size(width, expandBtnSize).x(0).y(-expandBtnSize)
-    } else {
-      rect.size(width, expandBtnSize).x(0).y(height)
-    }
-  }
 }

 export default Fishbone
--- a/simple-mind-map/src/layouts/FishboneBottom.js
+++ b/simple-mind-map/src/layouts/FishboneBottom.js
@@ -52,8 +52,8 @@ class Fishbone extends Base {
            // 节点生长方向
            newNode.dir =
              index % 2 === 0
-                ? CONSTANTS.LAYOUT_GROW_DIR.TOP
-                : CONSTANTS.LAYOUT_GROW_DIR.BOTTOM
+                ? CONSTANTS.TIMELINE_DIR.TOP
+                : CONSTANTS.TIMELINE_DIR.BOTTOM
          }
          // 计算二级节点的top值
          if (parent._node.isRoot) {
--- a/simple-mind-map/src/layouts/FishboneTop.js
+++ b/simple-mind-map/src/layouts/FishboneTop.js
@@ -52,8 +52,8 @@ class Fishbone extends Base {
            // 节点生长方向
            newNode.dir =
              index % 2 === 0
-                ? CONSTANTS.LAYOUT_GROW_DIR.TOP
-                : CONSTANTS.LAYOUT_GROW_DIR.BOTTOM
+                ? CONSTANTS.TIMELINE_DIR.TOP
+                : CONSTANTS.TIMELINE_DIR.BOTTOM
          }
          // 计算二级节点的top值
          if (parent._node.isRoot) {
@@ -281,7 +281,7 @@ class Fishbone extends Base {
        if (
          node.parent &&
          node.parent.isRoot &&
-          node.dir === CONSTANTS.LAYOUT_GROW_DIR.TOP
+          node.dir === CONSTANTS.TIMELINE_DIR.TOP
        ) {
          line.plot(
            `M ${x},${top} L ${x + lineLength},${
--- a/simple-mind-map/src/layouts/LogicalStructure.js
+++ b/simple-mind-map/src/layouts/LogicalStructure.js
@@ -172,7 +172,9 @@ class LogicalStructure extends Base {
      let x2 = item.left
      let y2 = item.top + item.height / 2
      // 节点使用横线风格，需要额外渲染横线
-      let nodeUseLineStyleOffset = nodeUseLineStyle ? item.width : 0
+      let nodeUseLineStyleOffset = nodeUseLineStyle
+        ? item.width
+        : 0
      y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
      y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
      let path = `M ${x1},${y1} L ${x1 + s1},${y1} L ${x1 + s1},${y2} L ${
@@ -258,7 +260,10 @@ class LogicalStructure extends Base {
    if (_x === translateX && _y === translateY) {
      return
    }
-    btn.translate(_x - translateX, _y - translateY)
+    btn.translate(
+      _x - translateX,
+      _y - translateY
+    )
  }

  //  创建概要节点
@@ -281,11 +286,6 @@ class LogicalStructure extends Base {
    gNode.left = right + generalizationNodeMargin
    gNode.top = top + (bottom - top - gNode.height) / 2
  }
-
-  // 渲染展开收起按钮的隐藏占位元素
-  renderExpandBtnRect(rect, expandBtnSize, width, height, node) {
-    rect.size(expandBtnSize, height).x(width).y(0)
-  }
 }

 export default LogicalStructure
--- a/simple-mind-map/src/layouts/MindMap.js
+++ b/simple-mind-map/src/layouts/MindMap.js
@@ -1,6 +1,5 @@
 import Base from './Base'
 import { walk, asyncRun } from '../utils'
-import { CONSTANTS } from '../constants/constant'

 //  思维导图
 class MindMap extends Base {
@@ -46,14 +45,11 @@ class MindMap extends Base {
            newNode.dir = parent._node.dir
          } else {
            // 节点生长方向
-            newNode.dir =
-              index % 2 === 0
-                ? CONSTANTS.LAYOUT_GROW_DIR.RIGHT
-                : CONSTANTS.LAYOUT_GROW_DIR.LEFT
+            newNode.dir = index % 2 === 0 ? 'right' : 'left'
          }
          // 根据生长方向定位到父节点的左侧或右侧
          newNode.left =
-            newNode.dir === CONSTANTS.LAYOUT_GROW_DIR.RIGHT
+            newNode.dir === 'right'
              ? parent._node.left +
                parent._node.width +
                this.getMarginX(layerIndex)
@@ -76,7 +72,7 @@ class MindMap extends Base {
        let leftChildrenAreaHeight = 0
        let rightChildrenAreaHeight = 0
        cur._node.children.forEach(item => {
-          if (item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT) {
+          if (item.dir === 'left') {
            leftLen++
            leftChildrenAreaHeight += item.height
          } else {
@@ -113,7 +109,7 @@ class MindMap extends Base {
          let leftTotalTop = baseTop - node.leftChildrenAreaHeight / 2
          let rightTotalTop = baseTop - node.rightChildrenAreaHeight / 2
          node.children.forEach(cur => {
-            if (cur.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT) {
+            if (cur.dir === 'left') {
              cur.top = leftTotalTop
              leftTotalTop += cur.height + marginY
            } else {
@@ -166,10 +162,7 @@ class MindMap extends Base {
          return
        }
        let _offset = 0
-        let addHeight =
-          item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-            ? leftAddHeight
-            : rightAddHeight
+        let addHeight = item.dir === 'left' ? leftAddHeight : rightAddHeight
        // 上面的节点往上移
        if (_index < index) {
          _offset = -addHeight
@@ -215,8 +208,10 @@ class MindMap extends Base {
      let x1 = 0
      let _s = 0
      // 节点使用横线风格，需要额外渲染横线
-      let nodeUseLineStyleOffset = nodeUseLineStyle ? item.width : 0
-      if (item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT) {
+      let nodeUseLineStyleOffset = nodeUseLineStyle
+        ? item.width
+        : 0
+      if (item.dir === 'left') {
        _s = -s1
        x1 = node.layerIndex === 0 ? left : left - expandBtnSize
        nodeUseLineStyleOffset = -nodeUseLineStyleOffset
@@ -225,10 +220,7 @@ class MindMap extends Base {
        x1 = node.layerIndex === 0 ? left + width : left + width + expandBtnSize
      }
      let y1 = top + height / 2
-      let x2 =
-        item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-          ? item.left + item.width
-          : item.left
+      let x2 = item.dir === 'left' ? item.left + item.width : item.left
      let y2 = item.top + item.height / 2
      y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
      y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
@@ -254,21 +246,18 @@ class MindMap extends Base {
      let x1 =
        node.layerIndex === 0
          ? left + width / 2
-          : item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
+          : item.dir === 'left'
          ? left - expandBtnSize
          : left + width + expandBtnSize
      let y1 = top + height / 2
-      let x2 =
-        item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-          ? item.left + item.width
-          : item.left
+      let x2 = item.dir === 'left' ? item.left + item.width : item.left
      let y2 = item.top + item.height / 2
      y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
      y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
      // 节点使用横线风格，需要额外渲染横线
      let nodeUseLineStylePath = ''
      if (nodeUseLineStyle) {
-        if (item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT) {
+        if (item.dir === 'left') {
          nodeUseLineStylePath = ` L ${item.left},${y2}`
        } else {
          nodeUseLineStylePath = ` L ${item.left + item.width},${y2}`
@@ -294,14 +283,11 @@ class MindMap extends Base {
      let x1 =
        node.layerIndex === 0
          ? left + width / 2
-          : item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
+          : item.dir === 'left'
          ? left - expandBtnSize
          : left + width + expandBtnSize
      let y1 = top + height / 2
-      let x2 =
-        item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-          ? item.left + item.width
-          : item.left
+      let x2 = item.dir === 'left' ? item.left + item.width : item.left
      let y2 = item.top + item.height / 2
      let path = ''
      y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
@@ -309,7 +295,7 @@ class MindMap extends Base {
      // 节点使用横线风格，需要额外渲染横线
      let nodeUseLineStylePath = ''
      if (this.mindMap.themeConfig.nodeUseLineStyle) {
-        if (item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT) {
+        if (item.dir === 'left') {
          nodeUseLineStylePath = ` L ${item.left},${y2}`
        } else {
          nodeUseLineStylePath = ` L ${item.left + item.width},${y2}`
@@ -334,8 +320,7 @@ class MindMap extends Base {
      ? height / 2
      : 0
    // 位置没有变化则返回
-    let _x =
-      node.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT ? 0 - expandBtnSize : width
+    let _x = (node.dir === 'left' ? 0 - expandBtnSize : width)
    let _y = height / 2 + nodeUseLineStyleOffset
    if (_x === translateX && _y === translateY) {
      return
@@ -347,7 +332,7 @@ class MindMap extends Base {

  //  创建概要节点
  renderGeneralization(node, gLine, gNode) {
-    let isLeft = node.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
+    let isLeft = node.dir === 'left'
    let {
      top,
      bottom,
@@ -373,15 +358,6 @@ class MindMap extends Base {
      (isLeft ? gNode.width : 0)
    gNode.top = top + (bottom - top - gNode.height) / 2
  }
-
-  // 渲染展开收起按钮的隐藏占位元素
-  renderExpandBtnRect(rect, expandBtnSize, width, height, node) {
-    if (node.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT) {
-      rect.size(expandBtnSize, height).x(-expandBtnSize).y(0)
-    } else {
-      rect.size(expandBtnSize, height).x(width).y(0)
-    }
-  }
 }

 export default MindMap
--- a/simple-mind-map/src/layouts/OrganizationStructure.js
+++ b/simple-mind-map/src/layouts/OrganizationStructure.js
@@ -255,11 +255,6 @@ class OrganizationStructure extends Base {
    gNode.top = bottom + generalizationNodeMargin
    gNode.left = left + (right - left - gNode.width) / 2
  }
-
-  // 渲染展开收起按钮的隐藏占位元素
-  renderExpandBtnRect(rect, expandBtnSize, width, height, node) {
-    rect.size(width, expandBtnSize).x(0).y(height)
-  }
 }

 export default OrganizationStructure
--- a/simple-mind-map/src/layouts/Timeline.js
+++ b/simple-mind-map/src/layouts/Timeline.js
@@ -1,6 +1,6 @@
 import Base from './Base'
 import { walk, asyncRun } from '../utils'
-import { CONSTANTS } from '../constants/constant'
+import { CONSTANTS } from '../utils/constant'

 //  时间轴
 class Timeline extends Base {
@@ -50,8 +50,8 @@ class Timeline extends Base {
              // 节点生长方向
              newNode.dir =
                index % 2 === 0
-                  ? CONSTANTS.LAYOUT_GROW_DIR.BOTTOM
-                  : CONSTANTS.LAYOUT_GROW_DIR.TOP
+                  ? CONSTANTS.TIMELINE_DIR.BOTTOM
+                  : CONSTANTS.TIMELINE_DIR.TOP
            }
          } else {
            newNode.dir = ''
@@ -151,7 +151,7 @@ class Timeline extends Base {
        if (
          parent &&
          parent.isRoot &&
-          node.dir === CONSTANTS.LAYOUT_GROW_DIR.TOP
+          node.dir === CONSTANTS.TIMELINE_DIR.TOP
        ) {
          // 遍历二级节点的子节点
          node.children.forEach(item => {
@@ -280,7 +280,7 @@ class Timeline extends Base {
        if (
          node.parent &&
          node.parent.isRoot &&
-          node.dir === CONSTANTS.LAYOUT_GROW_DIR.TOP
+          node.dir === CONSTANTS.TIMELINE_DIR.TOP
        ) {
          line.plot(`M ${x},${top} L ${x},${miny}`)
        } else {
@@ -301,7 +301,7 @@ class Timeline extends Base {
      if (
        node.parent &&
        node.parent.isRoot &&
-        node.dir === CONSTANTS.LAYOUT_GROW_DIR.TOP
+        node.dir === CONSTANTS.TIMELINE_DIR.TOP
      ) {
        btn.translate(
          width * 0.3 - expandBtnSize / 2 - translateX,
@@ -336,28 +336,6 @@ class Timeline extends Base {
    gNode.left = right + generalizationNodeMargin
    gNode.top = top + (bottom - top - gNode.height) / 2
  }
-
-  // 渲染展开收起按钮的隐藏占位元素
-  renderExpandBtnRect(rect, expandBtnSize, width, height, node) {
-    if (this.layout === CONSTANTS.LAYOUT.TIMELINE) {
-      rect.size(width, expandBtnSize).x(0).y(height)
-    } else {
-      let dir = ''
-      if (node.dir === CONSTANTS.LAYOUT_GROW_DIR.TOP) {
-        dir =
-          node.layerIndex === 1
-            ? CONSTANTS.LAYOUT_GROW_DIR.TOP
-            : CONSTANTS.LAYOUT_GROW_DIR.BOTTOM
-      } else {
-        dir = CONSTANTS.LAYOUT_GROW_DIR.BOTTOM
-      }
-      if (dir === CONSTANTS.LAYOUT_GROW_DIR.TOP) {
-        rect.size(width, expandBtnSize).x(0).y(-expandBtnSize)
-      } else {
-        rect.size(width, expandBtnSize).x(0).y(height)
-      }
-    }
-  }
 }

 export default Timeline
--- a/simple-mind-map/src/layouts/VerticalTimeline.js
+++ b/simple-mind-map/src/layouts/VerticalTimeline.js
@@ -1,431 +0,0 @@
-import Base from './Base'
-import { walk, asyncRun } from '../utils'
-import { CONSTANTS } from '../constants/constant'
-
-//  竖向时间轴
-class VerticalTimeline extends Base {
-  //  构造函数
-  constructor(opt = {}, layout) {
-    super(opt)
-    this.layout = layout
-  }
-
-  //  布局
-  doLayout(callback) {
-    let task = [
-      () => {
-        this.computedBaseValue()
-      },
-      () => {
-        this.computedTopValue()
-      },
-      () => {
-        this.adjustLeftTopValue()
-      },
-      () => {
-        callback(this.root)
-      }
-    ]
-    asyncRun(task)
-  }
-
-  //  遍历数据创建节点、计算根节点的位置，计算根节点的子节点的top值
-  computedBaseValue() {
-    walk(
-      this.renderer.renderTree,
-      null,
-      (cur, parent, isRoot, layerIndex, index) => {
-        let newNode = this.createNode(cur, parent, isRoot, layerIndex)
-        // 根节点定位在画布中心位置
-        if (isRoot) {
-          this.setNodeCenter(newNode)
-        } else {
-          // 非根节点
-          // 节点生长方向
-          // 三级及以下节点以上级为准
-          if (parent._node.dir) {
-            newNode.dir = parent._node.dir
-          } else {
-            newNode.dir =
-              index % 2 === 0
-                ? CONSTANTS.LAYOUT_GROW_DIR.RIGHT
-                : CONSTANTS.LAYOUT_GROW_DIR.LEFT
-          }
-          // 定位二级节点的left
-          if (parent._node.isRoot) {
-            newNode.left =
-              parent._node.left +
-              (cur._node.width > parent._node.width
-                ? -(cur._node.width - parent._node.width) / 2
-                : (parent._node.width - cur._node.width) / 2)
-          } else {
-            newNode.left =
-              newNode.dir === CONSTANTS.LAYOUT_GROW_DIR.RIGHT
-                ? parent._node.left +
-                  parent._node.width +
-                  this.getMarginX(layerIndex)
-                : parent._node.left -
-                  this.getMarginX(layerIndex) -
-                  newNode.width
-          }
-        }
-        if (!cur.data.expand) {
-          return true
-        }
-      },
-      (cur, parent, isRoot, layerIndex) => {
-        // 返回时计算节点的areaHeight，也就是子节点所占的高度之和，包括外边距
-        if (isRoot) {
-          return
-        }
-        let len = cur.data.expand === false ? 0 : cur._node.children.length
-        cur._node.childrenAreaHeight = len
-          ? cur._node.children.reduce((h, item) => {
-              return h + item.height
-            }, 0) +
-            (len + 1) * this.getMarginY(layerIndex + 1)
-          : 0
-      },
-      true,
-      0
-    )
-  }
-
-  //  遍历节点树计算节点的top
-  computedTopValue() {
-    walk(
-      this.root,
-      null,
-      (node, parent, isRoot, layerIndex, index) => {
-        if (
-          node.nodeData.data.expand &&
-          node.children &&
-          node.children.length
-        ) {
-          let marginY = this.getMarginY(layerIndex + 1)
-          // 定位二级节点的top
-          if (isRoot) {
-            let top = node.top + node.height
-            let totalTop = top + marginY
-            node.children.forEach(cur => {
-              cur.top = totalTop
-              totalTop += cur.height + marginY
-            })
-          } else {
-            // 定位三级及以下节点的top
-            let marginY = this.getMarginY(layerIndex + 1)
-            let baseTop = node.top + node.height / 2 + marginY
-            // 第一个子节点的top值 = 该节点中心的top值 - 子节点的高度之和的一半
-            let totalTop = baseTop - node.childrenAreaHeight / 2
-            node.children.forEach(cur => {
-              cur.top = totalTop
-              totalTop += cur.height + marginY
-            })
-          }
-        }
-      },
-      null,
-      true
-    )
-  }
-
-  //  调整节点left、top
-  adjustLeftTopValue() {
-    walk(
-      this.root,
-      null,
-      (node, parent, isRoot, layerIndex) => {
-        if (!node.nodeData.data.expand) {
-          return
-        }
-        if (isRoot) return
-        // 判断子节点所占的高度之和是否大于该节点自身，大于则需要调整位置
-        let base = this.getMarginY(layerIndex + 1) * 2 + node.height
-        let difference = node.childrenAreaHeight - base
-        if (difference > 0) {
-          this.updateBrothers(node, difference / 2)
-        }
-      },
-      null,
-      true
-    )
-  }
-
-  //  更新兄弟节点的top
-  updateBrothers(node, addHeight) {
-    if (node.parent) {
-      let childrenList = node.parent.children
-      let index = childrenList.findIndex(item => {
-        return item === node
-      })
-      childrenList.forEach((item, _index) => {
-        // 自定义节点位置
-        if (item.hasCustomPosition()) return
-        // 三级或三级以下节点自身位置不需要动
-        if (!node.parent.isRoot && item === node) return
-        let _offset = 0
-        // 二级节点上面的兄弟节点不需要移动，自身需要往下移动
-        if (node.parent.isRoot) {
-          // 上面的节点不用移
-          if (_index < index) {
-            _offset = 0
-          } else if (_index > index) {
-            // 下面的节点往下移
-            _offset = addHeight * 2
-          } else {
-            // 自身也要移动
-            _offset = addHeight
-          }
-        } else {
-          // 三级或三级以下节点两侧的兄弟节点向两侧移动
-          // 上面的节点往上移
-          if (_index < index) {
-            _offset = -addHeight
-          } else if (_index > index) {
-            // 下面的节点往下移
-            _offset = addHeight
-          }
-        }
-        item.top += _offset
-        // 同步更新子节点的位置
-        if (item.children && item.children.length) {
-          this.updateChildren(item.children, 'top', _offset)
-        }
-      })
-      // 更新父节点的位置
-      this.updateBrothers(node.parent, addHeight)
-    }
-  }
-
-  //  调整兄弟节点的top
-  updateBrothersTop(node, addHeight) {
-    if (node.parent && !node.parent.isRoot) {
-      let childrenList = node.parent.children
-      let index = childrenList.findIndex(item => {
-        return item === node
-      })
-      childrenList.forEach((item, _index) => {
-        if (item.hasCustomPosition()) {
-          // 适配自定义位置
-          return
-        }
-        let _offset = 0
-        // 下面的节点往下移
-        if (_index > index) {
-          _offset = addHeight
-        }
-        item.top += _offset
-        // 同步更新子节点的位置
-        if (item.children && item.children.length) {
-          this.updateChildren(item.children, 'top', _offset)
-        }
-      })
-      // 更新父节点的位置
-      this.updateBrothersTop(node.parent, addHeight)
-    }
-  }
-
-  //  绘制连线，连接该节点到其子节点
-  renderLine(node, lines, style, lineStyle) {
-    if (lineStyle === 'curve') {
-      this.renderLineCurve(node, lines, style)
-    } else if (lineStyle === 'direct') {
-      this.renderLineDirect(node, lines, style)
-    } else {
-      this.renderLineStraight(node, lines, style)
-    }
-  }
-
-  // 直线连接
-  renderLineStraight(node, lines, style) {
-    if (node.children.length <= 0) {
-      return []
-    }
-    let { expandBtnSize } = node
-    if (!this.mindMap.opt.alwaysShowExpandBtn) {
-      expandBtnSize = 0
-    }
-    if (node.isRoot) {
-      // 当前节点是根节点
-      let prevBother = node
-      // 根节点的子节点是和根节点同一水平线排列
-      node.children.forEach((item, index) => {
-        let y1 = prevBother.top + prevBother.height
-        let y2 = item.top
-        let x = node.left + node.width / 2
-        let path = `M ${x},${y1} L ${x},${y2}`
-        lines[index].plot(path)
-        style && style(lines[index], item)
-        prevBother = item
-      })
-    } else {
-      // 当前节点为非根节点
-      if (node.dir === CONSTANTS.LAYOUT_GROW_DIR.RIGHT) {
-        let nodeRight = node.left + node.width
-        let nodeYCenter = node.top + node.height / 2
-        let marginX = this.getMarginX(node.layerIndex + 1)
-        let offset = (marginX - expandBtnSize) * 0.6
-        node.children.forEach((item, index) => {
-          let itemLeft = item.left
-          let itemYCenter = item.top + item.height / 2
-          let path = `
-            M ${nodeRight},${nodeYCenter} 
-            L ${nodeRight + offset},${nodeYCenter} 
-            L ${nodeRight + offset},${itemYCenter} 
-            L ${itemLeft},${itemYCenter}`
-          lines[index].plot(path)
-          style && style(lines[index], item)
-        })
-      } else {
-        let nodeLeft = node.left
-        let nodeYCenter = node.top + node.height / 2
-        let marginX = this.getMarginX(node.layerIndex + 1)
-        let offset = (marginX - expandBtnSize) * 0.6
-        node.children.forEach((item, index) => {
-          let itemRight = item.left + item.width
-          let itemYCenter = item.top + item.height / 2
-          let path = `
-            M ${nodeLeft},${nodeYCenter} 
-            L ${nodeLeft - offset},${nodeYCenter} 
-            L ${nodeLeft - offset},${itemYCenter} 
-            L ${itemRight},${itemYCenter}`
-          lines[index].plot(path)
-          style && style(lines[index], item)
-        })
-      }
-    }
-  }
-
-  // 直连
-  renderLineDirect(node, lines, style) {
-    if (node.children.length <= 0) {
-      return []
-    }
-    let { left, top, width, height, expandBtnSize } = node
-    if (!this.mindMap.opt.alwaysShowExpandBtn) {
-      expandBtnSize = 0
-    }
-    node.children.forEach((item, index) => {
-      if (node.isRoot) {
-        let prevBother = node
-        // 根节点的子节点是和根节点同一水平线排列
-        node.children.forEach((item, index) => {
-          let y1 = prevBother.top + prevBother.height
-          let y2 = item.top
-          let x = node.left + node.width / 2
-          let path = `M ${x},${y1} L ${x},${y2}`
-          lines[index].plot(path)
-          style && style(lines[index], item)
-          prevBother = item
-        })
-      } else {
-        let x1 =
-          item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-            ? left - expandBtnSize
-            : left + width + expandBtnSize
-        let y1 = top + height / 2
-        let x2 =
-          item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-            ? item.left + item.width
-            : item.left
-        let y2 = item.top + item.height / 2
-        let path = `M ${x1},${y1} L ${x2},${y2}`
-        lines[index].plot(path)
-        style && style(lines[index], item)
-      }
-    })
-  }
-
-  //  曲线风格连线
-  renderLineCurve(node, lines, style) {
-    if (node.children.length <= 0) {
-      return []
-    }
-    let { left, top, width, height, expandBtnSize } = node
-    if (!this.mindMap.opt.alwaysShowExpandBtn) {
-      expandBtnSize = 0
-    }
-    node.children.forEach((item, index) => {
-      if (node.isRoot) {
-        let prevBother = node
-        // 根节点的子节点是和根节点同一水平线排列
-        node.children.forEach((item, index) => {
-          let y1 = prevBother.top + prevBother.height
-          let y2 = item.top
-          let x = node.left + node.width / 2
-          let path = `M ${x},${y1} L ${x},${y2}`
-          lines[index].plot(path)
-          style && style(lines[index], item)
-          prevBother = item
-        })
-      } else {
-        let x1 =
-          item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-            ? left - expandBtnSize
-            : left + width + expandBtnSize
-        let y1 = top + height / 2
-        let x2 =
-          item.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-            ? item.left + item.width
-            : item.left
-        let y2 = item.top + item.height / 2
-        let path = this.cubicBezierPath(x1, y1, x2, y2)
-        lines[index].plot(path)
-        style && style(lines[index], item)
-      }
-    })
-  }
-
-  //  渲染按钮
-  renderExpandBtn(node, btn) {
-    let { width, height, expandBtnSize, isRoot } = node
-    if (!isRoot) {
-      let { translateX, translateY } = btn.transform()
-      if (node.dir === CONSTANTS.LAYOUT_GROW_DIR.RIGHT) {
-        btn.translate(width - translateX, height / 2 - translateY)
-      } else {
-        btn.translate(-expandBtnSize - translateX, height / 2 - translateY)
-      }
-    }
-  }
-
-  //  创建概要节点
-  renderGeneralization(node, gLine, gNode) {
-    let isLeft = node.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT
-    let {
-      top,
-      bottom,
-      left,
-      right,
-      generalizationLineMargin,
-      generalizationNodeMargin
-    } = this.getNodeBoundaries(node, 'h', isLeft)
-    let x = isLeft
-      ? left - generalizationLineMargin
-      : right + generalizationLineMargin
-    let x1 = x
-    let y1 = top
-    let x2 = x
-    let y2 = bottom
-    let cx = x1 + (isLeft ? -20 : 20)
-    let cy = y1 + (y2 - y1) / 2
-    let path = `M ${x1},${y1} Q ${cx},${cy} ${x2},${y2}`
-    gLine.plot(path)
-    gNode.left =
-      x +
-      (isLeft ? -generalizationNodeMargin : generalizationNodeMargin) -
-      (isLeft ? gNode.width : 0)
-    gNode.top = top + (bottom - top - gNode.height) / 2
-  }
-
-  // 渲染展开收起按钮的隐藏占位元素
-  renderExpandBtnRect(rect, expandBtnSize, width, height, node) {
-    if (node.dir === CONSTANTS.LAYOUT_GROW_DIR.LEFT) {
-      rect.size(expandBtnSize, height).x(-expandBtnSize).y(0)
-    } else {
-      rect.size(expandBtnSize, height).x(width).y(0)
-    }
-  }
-}
-
-export default VerticalTimeline
--- a/simple-mind-map/src/parse/xmind.js
+++ b/simple-mind-map/src/parse/xmind.js
@@ -1,11 +1,5 @@
 import JSZip from 'jszip'
 import xmlConvert from 'xml-js'
-import {
-  getTextFromHtml,
-  imgToDataUrl,
-  parseDataUrl,
-  getImageSize
-} from '../utils/index'

 //  解析.xmind文件
 const parseXmindFile = file => {
@@ -16,7 +10,7 @@ const parseXmindFile = file => {
          let content = ''
          if (zip.files['content.json']) {
            let json = await zip.files['content.json'].async('string')
-            content = await transformXmind(json, zip.files)
+            content = transformXmind(json)
          } else if (zip.files['content.xml']) {
            let xml = await zip.files['content.xml'].async('string')
            let json = xmlConvert.xml2json(xml)
@@ -39,20 +33,18 @@ const parseXmindFile = file => {
 }

 //  转换xmind数据
-const transformXmind = async (content, files) => {
+const transformXmind = content => {
  let data = JSON.parse(content)[0]
  let nodeTree = data.rootTopic
  let newTree = {}
-  let waitLoadImageList = []
-  let walk = async (node, newNode) => {
+  let walk = (node, newNode) => {
    newNode.data = {
      // 节点内容
      text: node.title
    }
    // 节点备注
    if (node.notes) {
-      let notesData = node.notes.realHTML || node.notes.plain
-      newNode.data.note = notesData ? notesData.content || '' : ''
+      newNode.data.note = (node.notes.realHTML || node.notes.plain).content
    }
    // 超链接
    if (node.href && /^https?:\/\//.test(node.href)) {
@@ -62,42 +54,6 @@ const transformXmind = async (content, files) => {
    if (node.labels && node.labels.length > 0) {
      newNode.data.tag = node.labels
    }
-    // 图片
-    if (node.image && /\.(jpg|jpeg|png|gif|webp)$/.test(node.image.src)) {
-      try {
-        // 处理异步逻辑
-        let resolve = null
-        let promise = new Promise(_resolve => {
-          resolve = _resolve
-        })
-        waitLoadImageList.push(promise)
-        // 读取图片
-        let imageType = /\.([^.]+)$/.exec(node.image.src)[1]
-        let imageBase64 =
-          `data:image/${imageType};base64,` +
-          (await files['resources/' + node.image.src.split('/')[1]].async(
-            'base64'
-          ))
-        newNode.data.image = imageBase64
-        // 如果图片尺寸不存在
-        if (!node.image.width && !node.image.height) {
-          let imageSize = await getImageSize(imageBase64)
-          newNode.data.imageSize = {
-            width: imageSize.width,
-            height: imageSize.height
-          }
-        } else {
-          newNode.data.imageSize = {
-            width: node.image.width,
-            height: node.image.height
-          }
-        }
-        resolve()
-      } catch (error) {
-        console.log(error)
-        resolve()
-      }
-    }
    // 子节点
    newNode.children = []
    if (
@@ -113,7 +69,6 @@ const transformXmind = async (content, files) => {
    }
  }
  walk(nodeTree, newTree)
-  await Promise.all(waitLoadImageList)
  return newTree
 }

@@ -202,127 +157,8 @@ const transformOldXmind = content => {
  return newTree
 }

-// 数据转换为xmind文件
-const transformToXmind = async (data, name) => {
-  const id = 'simpleMindMap_' + Date.now()
-  const imageList = []
-  // 转换核心数据
-  let newTree = {}
-  let waitLoadImageList = []
-  let walk = async (node, newNode, isRoot) => {
-    let newData = {
-      structureClass: 'org.xmind.ui.logic.right',
-      title: getTextFromHtml(node.data.text), // 节点文本
-      children: {
-        attached: []
-      }
-    }
-    // 备注
-    if (node.data.note !== undefined) {
-      newData.notes = {
-        realHTML: {
-          content: node.data.note
-        },
-        plain: {
-          content: node.data.note
-        }
-      }
-    }
-    // 超链接
-    if (node.data.hyperlink !== undefined) {
-      newData.href = node.data.hyperlink
-    }
-    // 标签
-    if (node.data.tag !== undefined) {
-      newData.labels = node.data.tag || []
-    }
-    // 图片
-    if (node.data.image) {
-      try {
-        // 处理异步逻辑
-        let resolve = null
-        let promise = new Promise(_resolve => {
-          resolve = _resolve
-        })
-        waitLoadImageList.push(promise)
-        let imgName = ''
-        let imgData = node.data.image
-        // 网络图片要先转换成data:url
-        if (/^https?:\/\//.test(node.data.image)) {
-          imgData = await imgToDataUrl(node.data.image)
-        }
-        // 从data:url中解析出图片类型和base64
-        let dataUrlRes = parseDataUrl(imgData)
-        imgName = 'image_' + imageList.length + '.' + dataUrlRes.type
-        imageList.push({
-          name: imgName,
-          data: dataUrlRes.base64
-        })
-        newData.image = {
-          src: 'xap:resources/' + imgName,
-          width: node.data.imageSize.width,
-          height: node.data.imageSize.height
-        }
-        resolve()
-      } catch (error) {
-        console.log(error)
-        resolve()
-      }
-    }
-    // 样式
-    // 暂时不考虑样式
-    if (isRoot) {
-      newData.class = 'topic'
-      newNode.id = id
-      newNode.class = 'sheet'
-      newNode.title = name
-      newNode.extensions = []
-      newNode.topicPositioning = 'fixed'
-      newNode.topicOverlapping = 'overlap'
-      newNode.coreVersion = '2.100.0'
-      newNode.rootTopic = newData
-    } else {
-      Object.keys(newData).forEach(key => {
-        newNode[key] = newData[key]
-      })
-    }
-    if (node.children && node.children.length > 0) {
-      node.children.forEach(child => {
-        let newChild = {}
-        walk(child, newChild)
-        newData.children.attached.push(newChild)
-      })
-    }
-  }
-  walk(data, newTree, true)
-  await Promise.all(waitLoadImageList)
-  const contentData = [newTree]
-  // 创建压缩包
-  const zip = new JSZip()
-  zip.file('content.json', JSON.stringify(contentData))
-  zip.file(
-    'metadata.json',
-    `{"modifier":"","dataStructureVersion":"1","layoutEngineVersion":"2","activeSheetId":"${id}"}`
-  )
-  const manifestData = {
-    'file-entries': { 'content.json': {}, 'metadata.json': {} }
-  }
-  // 图片
-  if (imageList.length > 0) {
-    imageList.forEach(item => {
-      manifestData['file-entries']['resources/' + item.name] = {}
-      const img = zip.folder('resources')
-      img.file(item.name, item.data, { base64: true })
-    })
-  }
-  zip.file('manifest.json', JSON.stringify(manifestData))
-  const zipData = await zip.generateAsync({ type: 'blob' })
-  return zipData
-}
-
 export default {
  parseXmindFile,
  transformXmind,
-  transformOldXmind,
-  transformToXmind
+  transformOldXmind
 }
--- a/simple-mind-map/src/plugins/ExportPDF.js
+++ b/simple-mind-map/src/plugins/ExportPDF.js
@@ -1,44 +0,0 @@
-import JsPDF from 'jspdf'
-
-//  导出PDF插件，需要通过Export插件使用
-class ExportPDF {
-  //  构造函数
-  constructor(opt) {
-    this.mindMap = opt.mindMap
-  }
-
-  //  导出为pdf
-  pdf(name, img) {
-    let pdf = new JsPDF('', 'pt', 'a4')
-    let a4Width = 595
-    let a4Height = 841
-    let a4Ratio = a4Width / a4Height
-    let image = new Image()
-    image.onload = () => {
-      let imageWidth = image.width
-      let imageHeight = image.height
-      let imageRatio = imageWidth / imageHeight
-      let w, h
-      if (imageWidth <= a4Width && imageHeight <= a4Height) {
-        // 使用图片原始宽高
-        w = imageWidth
-        h = imageHeight
-      } else if (a4Ratio > imageRatio) {
-        // 以a4Height为高度，缩放图片宽度
-        w = imageRatio * a4Height
-        h = a4Height
-      } else {
-        // 以a4Width为宽度，缩放图片高度
-        w = a4Width
-        h = a4Width / imageRatio
-      }
-      pdf.addImage(img, 'PNG', (a4Width - w) / 2, (a4Height - h) / 2, w, h)
-      pdf.save(name)
-    }
-    image.src = img
-  }
-}
-
-ExportPDF.instanceName = 'doExportPDF'
-
-export default ExportPDF
--- a/simple-mind-map/src/plugins/ExportXMind.js
+++ b/simple-mind-map/src/plugins/ExportXMind.js
@@ -1,19 +0,0 @@
-import xmind from '../parse/xmind'
-
-//  导出XMind插件，需要通过Export插件使用
-class ExportXMind {
-  //  构造函数
-  constructor(opt) {
-    this.mindMap = opt.mindMap
-  }
-
-  // 导出xmind
-  async xmind(data, name) {
-    const zipData = await xmind.transformToXmind(data, name)
-    return zipData
-  }
-}
-
-ExportXMind.instanceName = 'doExportXMind'
-
-export default ExportXMind
--- a/simple-mind-map/src/plugins/NodeImgAdjust.js
+++ b/simple-mind-map/src/plugins/NodeImgAdjust.js
@@ -1,226 +0,0 @@
-// 节点图片大小调整插件
-import { resizeImgSizeByOriginRatio } from '../utils/index'
-import btnsSvg from '../svg/btns'
-
-class NodeImgAdjust {
-  //  构造函数
-  constructor({ mindMap }) {
-    this.mindMap = mindMap
-    this.resizeBtnSize = 26 // 调整按钮的大小
-    this.handleEl = null // 自定义元素，用来渲染临时图片、调整按钮
-    this.isShowHandleEl = false // 自定义元素是否在显示中
-    this.node = null // 当前节点实例
-    this.img = null // 当前节点的图片节点
-    this.rect = null // 当前图片节点的尺寸信息
-    this.isMousedown = false // 当前是否是按住调整按钮状态
-    this.currentImgWidth = 0 // 当前拖拽实时图片的大小
-    this.currentImgHeight = 0
-    this.isAdjusted = false // 是否是拖拽结束后的渲染期间
-    this.bindEvent()
-  }
-
-  // 监听事件
-  bindEvent() {
-    this.onNodeImgMouseleave = this.onNodeImgMouseleave.bind(this)
-    this.onNodeImgMousemove = this.onNodeImgMousemove.bind(this)
-    this.onMousemove = this.onMousemove.bind(this)
-    this.onMouseup = this.onMouseup.bind(this)
-    this.onRenderEnd = this.onRenderEnd.bind(this)
-    this.mindMap.on('node_img_mouseleave', this.onNodeImgMouseleave)
-    this.mindMap.on('node_img_mousemove', this.onNodeImgMousemove)
-    this.mindMap.on('mousemove', this.onMousemove)
-    this.mindMap.on('mouseup', this.onMouseup)
-    this.mindMap.on('node_mouseup', this.onMouseup)
-    this.mindMap.on('node_tree_render_end', this.onRenderEnd)
-  }
-
-  // 解绑事件
-  unBindEvent() {
-    this.mindMap.off('node_img_mouseleave', this.onNodeImgMouseleave)
-    this.mindMap.off('node_img_mousemove', this.onNodeImgMousemove)
-    this.mindMap.off('mousemove', this.onMousemove)
-    this.mindMap.off('mouseup', this.onMouseup)
-    this.mindMap.off('node_mouseup', this.onMouseup)
-    this.mindMap.off('node_tree_render_end', this.onRenderEnd)
-  }
-
-  // 节点图片鼠标移动事件
-  onNodeImgMousemove(node, img) {
-    // 如果当前正在拖动调整中那么直接返回
-    if (this.isMousedown || this.isAdjusted || this.mindMap.opt.readonly) return
-    // 如果在当前节点内移动，以及自定义元素已经是显示状态，那么直接返回
-    if (this.node === node && this.isShowHandleEl) return
-    // 更新当前节点信息
-    this.node = node
-    this.img = img
-    this.rect = this.img.rbox()
-    // 显示自定义元素
-    this.showHandleEl()
-  }
-
-  // 节点图片鼠标移出事件
-  onNodeImgMouseleave() {
-    if (this.isMousedown) return
-    this.hideHandleEl()
-  }
-
-  // 隐藏节点实际的图片
-  hideNodeImage() {
-    if (!this.img) return
-    this.img.hide()
-  }
-
-  // 显示节点实际的图片
-  showNodeImage() {
-    if (!this.img) return
-    this.img.show()
-  }
-
-  // 显示自定义元素
-  showHandleEl() {
-    if (!this.handleEl) {
-      this.createResizeBtnEl()
-    }
-    this.setHandleElRect()
-    document.body.appendChild(this.handleEl)
-    this.isShowHandleEl = true
-  }
-
-  // 隐藏自定义元素
-  hideHandleEl() {
-    if (!this.isShowHandleEl) return
-    this.isShowHandleEl = false
-    document.body.removeChild(this.handleEl)
-    this.handleEl.style.backgroundImage = ``
-    this.handleEl.style.width = 0
-    this.handleEl.style.height = 0
-    this.handleEl.style.left = 0
-    this.handleEl.style.top = 0
-  }
-
-  // 设置自定义元素尺寸位置信息
-  setHandleElRect() {
-    let { width, height, x, y } = this.rect
-    this.handleEl.style.left = `${x}px`
-    this.handleEl.style.top = `${y}px`
-    this.currentImgWidth = width
-    this.currentImgHeight = height
-    this.updateHandleElSize()
-  }
-
-  // 更新自定义元素宽高
-  updateHandleElSize() {
-    this.handleEl.style.width = `${this.currentImgWidth}px`
-    this.handleEl.style.height = `${this.currentImgHeight}px`
-  }
-
-  // 创建调整按钮元素
-  createResizeBtnEl() {
-    // 容器元素
-    this.handleEl = document.createElement('div')
-    this.handleEl.style.cssText = `
-      pointer-events: none;
-      position: fixed;
-      background-size: cover;
-    `
-    // 调整按钮元素
-    const btnEl = document.createElement('div')
-    btnEl.innerHTML = btnsSvg.imgAdjust
-    btnEl.style.cssText = `
-      position: absolute;
-      right: 0;
-      bottom: 0;
-      pointer-events: auto;
-      background-color: rgba(0, 0, 0, 0.3);
-      width: ${this.resizeBtnSize}px;
-      height: ${this.resizeBtnSize}px;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      cursor: nwse-resize;
-    `
-    this.handleEl.appendChild(btnEl)
-    // 给按钮元素绑定事件
-    btnEl.addEventListener('mouseenter', () => {
-      // 移入按钮，会触发节点图片的移出事件，所以需要再次显示按钮
-      this.showHandleEl()
-    })
-    btnEl.addEventListener('mouseleave', () => {
-      // 移除按钮，需要隐藏按钮
-      if (this.isMousedown) return
-      this.hideHandleEl()
-    })
-    btnEl.addEventListener('mousedown', e => {
-      this.onMousedown(e)
-    })
-  }
-
-  // 鼠标按钮按下事件
-  onMousedown() {
-    this.isMousedown = true
-    // 隐藏节点实际图片
-    this.hideNodeImage()
-    // 将节点图片渲染到自定义元素上
-    this.handleEl.style.backgroundImage = `url(${this.node.nodeData.data.image})`
-  }
-
-  // 鼠标移动
-  onMousemove(e) {
-    if (!this.isMousedown) return
-    e.preventDefault()
-    // 计算当前拖拽位置对应的图片的实时大小
-    let { width: imageOriginWidth, height: imageOriginHeight } =
-      this.node.nodeData.data.imageSize
-    let newWidth = e.clientX - this.rect.x
-    let newHeight = e.clientY - this.rect.y
-    if (newWidth <= 0 || newHeight <= 0) return
-    let [actWidth, actHeight] = resizeImgSizeByOriginRatio(
-      imageOriginWidth,
-      imageOriginHeight,
-      newWidth,
-      newHeight
-    )
-    this.currentImgWidth = actWidth
-    this.currentImgHeight = actHeight
-    this.updateHandleElSize()
-  }
-
-  // 鼠标松开
-  onMouseup() {
-    if (!this.isMousedown) return
-    // 显示节点实际图片
-    this.showNodeImage()
-    // 隐藏自定义元素
-    this.hideHandleEl()
-    // 更新节点图片为新的大小
-    let { image, imageTitle } = this.node.nodeData.data
-    let { scaleX, scaleY } = this.mindMap.draw.transform()
-    this.mindMap.execCommand('SET_NODE_IMAGE', this.node, {
-      url: image,
-      title: imageTitle,
-      width: this.currentImgWidth / scaleX,
-      height: this.currentImgHeight / scaleY,
-      custom: true // 代表自定义了图片大小
-    })
-    this.isAdjusted = true
-    this.isMousedown = false
-  }
-
-  // 渲染完成事件
-  onRenderEnd() {
-    if (!this.isAdjusted) {
-      this.hideHandleEl()
-      return
-    }
-    this.isAdjusted = false
-  }
-
-  // 插件被移除前做的事情
-  beforePluginRemove() {
-    this.unBindEvent()
-  }
-}
-
-NodeImgAdjust.instanceName = 'nodeImgAdjust'
-
-export default NodeImgAdjust
--- a/simple-mind-map/src/plugins/Search.js
+++ b/simple-mind-map/src/plugins/Search.js
@@ -1,160 +0,0 @@
-import { bfsWalk, getTextFromHtml, isUndef } from '../utils/index'
-
-// 搜索插件
-class Search {
-  //  构造函数
-  constructor({ mindMap }) {
-    this.mindMap = mindMap
-    // 是否正在搜索
-    this.isSearching = false
-    // 搜索文本
-    this.searchText = ''
-    // 匹配的节点列表
-    this.matchNodeList = []
-    // 当前所在的节点列表索引
-    this.currentIndex = -1
-    // 不要复位搜索文本
-    this.notResetSearchText = false
-    this.onDataChange = this.onDataChange.bind(this)
-    this.mindMap.on('data_change', this.onDataChange)
-  }
-
-  // 节点数据改变了，需要重新搜索
-  onDataChange() {
-    if (this.notResetSearchText) {
-      this.notResetSearchText = false
-      return
-    }
-    this.searchText = ''
-  }
-
-  // 搜索
-  search(text, callback) {
-    if (isUndef(text)) return this.endSearch()
-    text = String(text)
-    this.isSearching = true
-    if (this.searchText === text) {
-      // 和上一次搜索文本一样，那么搜索下一个
-      this.searchNext(callback)
-    } else {
-      // 和上次搜索文本不一样，那么重新开始
-      this.searchText = text
-      this.doSearch()
-      this.searchNext(callback)
-    }
-    this.emitEvent()
-  }
-
-  // 结束搜索
-  endSearch() {
-    if (!this.isSearching) return
-    this.searchText = ''
-    this.matchNodeList = []
-    this.currentIndex = -1
-    this.notResetSearchText = false
-    this.isSearching = false
-    this.emitEvent()
-  }
-
-  // 搜索匹配的节点
-  doSearch() {
-    this.matchNodeList = []
-    this.currentIndex = -1
-    bfsWalk(this.mindMap.renderer.root, node => {
-      let { richText, text } = node.nodeData.data
-      if (richText) {
-        text = getTextFromHtml(text)
-      }
-      if (text.includes(this.searchText)) {
-        this.matchNodeList.push(node)
-      }
-    })
-  }
-
-  // 搜索下一个，定位到下一个匹配节点
-  searchNext(callback) {
-    if (!this.isSearching || this.matchNodeList.length <= 0) return
-    if (this.currentIndex < this.matchNodeList.length - 1) {
-      this.currentIndex++
-    } else {
-      this.currentIndex = 0
-    }
-    let currentNode = this.matchNodeList[this.currentIndex]
-    this.notResetSearchText = true
-    this.mindMap.execCommand('GO_TARGET_NODE', currentNode, () => {
-      this.notResetSearchText = false
-      callback()
-    })
-  }
-
-  // 替换当前节点
-  replace(replaceText) {
-    if (
-      isUndef(replaceText) ||
-      !this.isSearching ||
-      this.matchNodeList.length <= 0
-    )
-      return
-    replaceText = String(replaceText)
-    let currentNode = this.matchNodeList[this.currentIndex]
-    if (!currentNode) return
-    let text = this.getReplacedText(currentNode, this.searchText, replaceText)
-    this.notResetSearchText = true
-    currentNode.setText(text, currentNode.nodeData.data.richText, true)
-    this.matchNodeList = this.matchNodeList.filter(node => {
-      return currentNode !== node
-    })
-    if (this.currentIndex > this.matchNodeList.length - 1) {
-      this.currentIndex = -1
-    } else {
-      this.currentIndex--
-    }
-    this.emitEvent()
-  }
-
-  // 替换所有
-  replaceAll(replaceText) {
-    if (
-      isUndef(replaceText) ||
-      !this.isSearching ||
-      this.matchNodeList.length <= 0
-    )
-      return
-    replaceText = String(replaceText)
-    this.matchNodeList.forEach(node => {
-      let text = this.getReplacedText(node, this.searchText, replaceText)
-      this.mindMap.renderer.setNodeDataRender(
-        node,
-        {
-          text,
-          resetRichText: !!node.nodeData.data.richText
-        },
-        true
-      )
-    })
-    this.mindMap.render()
-    this.mindMap.command.addHistory()
-    this.endSearch()
-  }
-
-  // 获取某个节点替换后的文本
-  getReplacedText(node, searchText, replaceText) {
-    let { richText, text } = node.nodeData.data
-    if (richText) {
-      text = getTextFromHtml(text)
-    }
-    return text.replaceAll(searchText, replaceText)
-  }
-
-  // 发送事件
-  emitEvent() {
-    this.mindMap.emit('search_info_change', {
-      currentIndex: this.currentIndex,
-      total: this.matchNodeList.length
-    })
-  }
-}
-
-Search.instanceName = 'search'
-
-export default Search
--- a/simple-mind-map/src/plugins/TouchEvent.js
+++ b/simple-mind-map/src/plugins/TouchEvent.js
@@ -1,126 +0,0 @@
-// 手势事件支持插件
-class TouchEvent {
-  //  构造函数
-  constructor({ mindMap }) {
-    this.mindMap = mindMap
-    this.touchesNum = 0
-    this.singleTouchstartEvent = null
-    this.clickNum = 0
-    this.doubleTouchmoveDistance = 0
-    this.bindEvent()
-  }
-
-  // 绑定事件
-  bindEvent() {
-    this.onTouchstart = this.onTouchstart.bind(this)
-    this.onTouchmove = this.onTouchmove.bind(this)
-    this.onTouchcancel = this.onTouchcancel.bind(this)
-    this.onTouchend = this.onTouchend.bind(this)
-    window.addEventListener('touchstart', this.onTouchstart)
-    window.addEventListener('touchmove', this.onTouchmove)
-    window.addEventListener('touchcancel', this.onTouchcancel)
-    window.addEventListener('touchend', this.onTouchend)
-  }
-
-  // 解绑事件
-  unBindEvent() {
-    window.removeEventListener('touchstart', this.onTouchstart)
-    window.removeEventListener('touchmove', this.onTouchmove)
-    window.removeEventListener('touchcancel', this.onTouchcancel)
-    window.removeEventListener('touchend', this.onTouchend)
-  }
-
-  // 手指按下事件
-  onTouchstart(e) {
-    this.touchesNum = e.touches.length
-    if (this.touchesNum === 1) {
-      let touch = e.touches[0]
-      this.singleTouchstartEvent = touch
-      this.dispatchMouseEvent('mousedown', touch.target, touch)
-    }
-  }
-
-  // 手指移动事件
-  onTouchmove(e) {
-    let len = e.touches.length
-    if (len === 1) {
-      let touch = e.touches[0]
-      this.dispatchMouseEvent('mousemove', touch.target, touch)
-    } else if (len === 2) {
-      let touch1 = e.touches[0]
-      let touch2 = e.touches[1]
-      let ox = touch1.clientX - touch2.clientX
-      let oy = touch1.clientY - touch2.clientY
-      let distance = Math.sqrt(Math.pow(ox, 2) + Math.pow(oy, 2))
-      // 以两指中心点进行缩放
-      let { x: touch1ClientX, y: touch1ClientY } = this.mindMap.toPos(touch1.clientX, touch1.clientY)
-      let { x: touch2ClientX, y: touch2ClientY } = this.mindMap.toPos(touch2.clientX, touch2.clientY)
-      let cx = (touch1ClientX + touch2ClientX) / 2
-      let cy = (touch1ClientY + touch2ClientY) / 2
-      if (distance > this.doubleTouchmoveDistance) {
-        // 放大
-        this.mindMap.view.enlarge(cx, cy)
-      } else {
-        // 缩小
-        this.mindMap.view.narrow(cx, cy)
-      }
-      this.doubleTouchmoveDistance = distance
-    }
-  }
-
-  // 手指取消事件
-  onTouchcancel(e) {}
-
-  // 手指松开事件
-  onTouchend(e) {
-    this.dispatchMouseEvent('mouseup', e.target)
-    if (this.touchesNum === 1) {
-      // 模拟双击事件
-      this.clickNum++
-      setTimeout(() => {
-        this.clickNum = 0
-      }, 300)
-      let ev = this.singleTouchstartEvent
-      if (this.clickNum > 1) {
-        this.clickNum = 0
-        this.dispatchMouseEvent('dblclick', ev.target, ev)
-      } else {
-        // 点击事件应该不用模拟
-        // this.dispatchMouseEvent('click', ev.target, ev)
-      }
-    }
-    this.touchesNum = 0
-    this.singleTouchstartEvent = null
-    this.doubleTouchmoveDistance = 0
-  }
-
-  // 发送鼠标事件
-  dispatchMouseEvent(eventName, target, e) {
-    let opt = {}
-    if (e) {
-      opt = {
-        screenX: e.screenX,
-        screenY: e.screenY,
-        clientX: e.clientX,
-        clientY: e.clientY,
-        which: 1
-      }
-    }
-    let event = new MouseEvent(eventName, {
-      view: window,
-      bubbles: true,
-      cancelable: true,
-      ...opt
-    })
-    target.dispatchEvent(event)
-  }
-
-  // 插件被移除前做的事情
-  beforePluginRemove() {
-    this.unBindEvent()
-  }
-}
-
-TouchEvent.instanceName = 'touchEvent'
-
-export default TouchEvent
--- a/simple-mind-map/src/svg/btns.js
+++ b/simple-mind-map/src/svg/btns.js
@@ -4,11 +4,7 @@ const open = `<svg t="1618141562310" class="icon" viewBox="0 0 1024 1024" versio
 //  收缩按钮
 const close = `<svg t="1618141589243" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13611" width="200" height="200"><path d="M512 105.472c225.28 0 407.04 181.76 407.04 407.04s-181.76 407.04-407.04 407.04-407.04-181.76-407.04-407.04 181.76-407.04 407.04-407.04z m0-74.24c-265.216 0-480.768 215.552-480.768 480.768s215.552 480.768 480.768 480.768 480.768-215.552 480.768-480.768-215.552-480.768-480.768-480.768z" p-id="13612"></path><path d="M252.928 474.624h518.144v74.24h-518.144z" p-id="13613"></path></svg>`

-// 图片调整按钮
-const imgAdjust = `<svg width="12px" height="12px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#ffffff" d="M1008.128 614.4a25.6 25.6 0 0 0-27.648 5.632l-142.848 142.848L259.072 186.88 401.92 43.52A25.6 25.6 0 0 0 384 0h-358.4a25.6 25.6 0 0 0-25.6 25.6v358.4a25.6 25.6 0 0 0 43.52 17.92l143.36-142.848 578.048 578.048-142.848 142.848a25.6 25.6 0 0 0 17.92 43.52h358.4a25.6 25.6 0 0 0 25.6-25.6v-358.4a25.6 25.6 0 0 0-15.872-25.088z"  /></svg>`
-
 export default {
  open,
-  close,
-  imgAdjust
+  close
 }
--- a/simple-mind-map/src/plugins/associativeLine/associativeLineControls.js
+++ b/simple-mind-map/src/plugins/associativeLine/associativeLineControls.js
--- a/simple-mind-map/src/plugins/associativeLine/associativeLineText.js
+++ b/simple-mind-map/src/plugins/associativeLine/associativeLineText.js
@@ -1,5 +1,5 @@
 import { Text } from '@svgdotjs/svg.js'
-import { getStrWithBrFromHtml } from '../../utils/index'
+import { getStrWithBrFromHtml } from './index'

 // 创建文字节点
 function createText(data) {
--- a/simple-mind-map/src/plugins/associativeLine/associativeLineUtils.js
+++ b/simple-mind-map/src/plugins/associativeLine/associativeLineUtils.js
--- a/simple-mind-map/src/constants/constant.js
+++ b/simple-mind-map/src/constants/constant.js
@@ -27,169 +27,136 @@ export const themeList = [
  {
    name: '默认',
    value: 'default',
-    dark: false
  },
  {
    name: '暗色2',
    value: 'dark2',
-    dark: true
  },
  {
    name: '天清绿',
    value: 'skyGreen',
-    dark: false
  },
  {
    name: '脑图经典2',
    value: 'classic2',
-    dark: false
  },
  {
    name: '脑图经典3',
    value: 'classic3',
-    dark: false
  },
  {
    name: '经典绿',
    value: 'classicGreen',
-    dark: false
  },
  {
    name: '经典蓝',
    value: 'classicBlue',
-    dark: false
  },
  {
    name: '天空蓝',
    value: 'blueSky',
-    dark: false
  },
  {
    name: '脑残粉',
    value: 'brainImpairedPink',
-    dark: false
  },
  {
    name: '暗色',
    value: 'dark',
-    dark: true
  },
  {
    name: '泥土黄',
    value: 'earthYellow',
-    dark: false
  },
  {
    name: '清新绿',
    value: 'freshGreen',
-    dark: false
  },
  {
    name: '清新红',
    value: 'freshRed',
-    dark: false
  },
  {
    name: '浪漫紫',
    value: 'romanticPurple',
-    dark: false
  },
  {
    name: '粉红葡萄',
    value: 'pinkGrape',
-    dark: false
  },
  {
    name: '薄荷',
    value: 'mint',
-    dark: false
  },
  {
    name: '金色vip',
    value: 'gold',
-    dark: false
  },
  {
    name: '活力橙',
    value: 'vitalityOrange',
-    dark: false
  },
  {
    name: '绿叶',
    value: 'greenLeaf',
-    dark: false
  },
  {
    name: '脑图经典',
    value: 'classic',
-    dark: true
  },
  {
    name: '脑图经典4',
    value: 'classic4',
-    dark: false
  },
  {
    name: '小黄人',
    value: 'minions',
-    dark: false
  },
  {
    name: '简约黑',
    value: 'simpleBlack',
-    dark: true
  },
  {
    name: '课程绿',
    value: 'courseGreen',
-    dark: false
  },
  {
    name: '咖啡',
    value: 'coffee',
-    dark: false
  },
  {
    name: '红色精神',
    value: 'redSpirit',
-    dark: false
  },
  {
    name: '黑色幽默',
    value: 'blackHumour',
-    dark: true
  },
  {
    name: '深夜办公室',
    value: 'lateNightOffice',
-    dark: true
  },
  {
    name: '黑金',
    value: 'blackGold',
-    dark: true
  },
  {
    name: '牛油果',
    value: 'avocado',
-    dark: false
  },
  {
    name: '秋天',
    value: 'autumn',
-    dark: false
  },
  {
    name: '橙汁',
    value: 'orangeJuice',
-    dark: true
  }
 ]

 // 常量
 export const CONSTANTS = {
  CHANGE_THEME: 'changeTheme',
-  CHANGE_LAYOUT: 'changeLayout',
  SET_DATA: 'setData',
  TRANSFORM_TO_NORMAL_NODE: 'transformAllNodesToNormalNode',
  MODE: {
@@ -203,8 +170,7 @@ export const CONSTANTS = {
    CATALOG_ORGANIZATION: 'catalogOrganization',
    TIMELINE: 'timeline',
    TIMELINE2: 'timeline2',
-    FISHBONE: 'fishbone',
-    VERTICAL_TIMELINE: 'verticalTimeline'
+    FISHBONE: 'fishbone'
  },
  DIR: {
    UP: 'up',
@@ -240,15 +206,9 @@ export const CONSTANTS = {
    BOTTOM: 'bottom',
    CENTER: 'center'
  },
-  LAYOUT_GROW_DIR: {
-    LEFT: 'left',
+  TIMELINE_DIR: {
    TOP: 'top',
-    RIGHT: 'right',
    BOTTOM: 'bottom'
-  },
-  PASTE_TYPE: {
-    CLIP_BOARD: 'clipBoard',
-    CANVAS: 'canvas'
  }
 }

@@ -286,10 +246,6 @@ export const layoutList = [
    name: '时间轴2',
    value: CONSTANTS.LAYOUT.TIMELINE2,
  },
-  {
-    name: '竖向时间轴',
-    value: CONSTANTS.LAYOUT.VERTICAL_TIMELINE,
-  },
  {
    name: '鱼骨图',
    value: CONSTANTS.LAYOUT.FISHBONE,
@@ -302,31 +258,5 @@ export const layoutValueList = [
  CONSTANTS.LAYOUT.ORGANIZATION_STRUCTURE,
  CONSTANTS.LAYOUT.TIMELINE,
  CONSTANTS.LAYOUT.TIMELINE2,
-  CONSTANTS.LAYOUT.VERTICAL_TIMELINE,
  CONSTANTS.LAYOUT.FISHBONE
-]
-
-// 节点数据中非样式的字段
-export const nodeDataNoStylePropList = [
-  'text',
-  'image',
-  'imageTitle',
-  'imageSize',
-  'icon',
-  'tag',
-  'hyperlink',
-  'hyperlinkTitle',
-  'note',
-  'expand',
-  'isActive',
-  'generalization',
-  'richText',
-  'resetRichText',
-  'uid',
-  'activeStyle'
-]
-
-// 数据缓存
-export const commonCaches = {
-  measureCustomNodeContentSizeEl: null
-}
+]
--- a/simple-mind-map/src/utils/index.js
+++ b/simple-mind-map/src/utils/index.js
@@ -1,5 +1,3 @@
-import { v4 as uuidv4 } from 'uuid'
-
 //  深度优先遍历树
 export const walk = (
  root,
@@ -33,11 +31,9 @@ export const walk = (

 //  广度优先遍历树
 export const bfsWalk = (root, callback) => {
+  callback(root)
  let stack = [root]
  let isStop = false
-  if (callback(root, null) === 'stop') {
-    isStop = true
-  }
  while (stack.length) {
    if (isStop) {
      break
@@ -45,9 +41,8 @@ export const bfsWalk = (root, callback) => {
    let cur = stack.shift()
    if (cur.children && cur.children.length) {
      cur.children.forEach(item => {
-        if (isStop) return
        stack.push(item)
-        if (callback(item, cur) === 'stop') {
+        if (callback(item) === 'stop') {
          isStop = true
        }
      })
@@ -55,26 +50,6 @@ export const bfsWalk = (root, callback) => {
  }
 }

-// 按原比例缩放图片
-export const resizeImgSizeByOriginRatio = (
-  width,
-  height,
-  newWidth,
-  newHeight
-) => {
-  let arr = []
-  let nRatio = width / height
-  let mRatio = newWidth / newHeight
-  if (nRatio > mRatio) {
-    // 固定高度
-    arr = [nRatio * newHeight, newHeight]
-  } else {
-    // 固定宽度
-    arr = [newWidth, newWidth / nRatio]
-  }
-  return arr
-}
-
 //  缩放图片尺寸
 export const resizeImgSize = (width, height, maxWidth, maxHeight) => {
  let nRatio = width / height
@@ -162,12 +137,7 @@ export const copyRenderTree = (tree, root, removeActiveState = false) => {
 }

 //  复制节点树数据
-export const copyNodeTree = (
-  tree,
-  root,
-  removeActiveState = false,
-  keepId = false
-) => {
+export const copyNodeTree = (tree, root, removeActiveState = false, keepId = false) => {
  tree.data = simpleDeepClone(root.nodeData ? root.nodeData.data : root.data)
  // 去除节点id，因为节点id不能重复
  if (tree.data.id && !keepId) delete tree.data.id
@@ -218,18 +188,6 @@ export const imgToDataUrl = src => {
  })
 }

-// 解析dataUrl
-export const parseDataUrl = data => {
-  if (!/^data:/.test(data)) return data
-  let [typeStr, base64] = data.split(',')
-  let res = /^data:[^/]+\/([^;]+);/.exec(typeStr)
-  let type = res[1]
-  return {
-    type,
-    base64
-  }
-}
-
 //  下载文件
 export const downloadFile = (file, fileName) => {
  let a = document.createElement('a')
@@ -278,8 +236,8 @@ export const degToRad = deg => {
  return deg * (Math.PI / 180)
 }

-// 驼峰转连字符
-export const camelCaseToHyphen = str => {
+// 驼峰转连字符 
+export const camelCaseToHyphen = (str) => {
  return str.replace(/([a-z])([A-Z])/g, (...args) => {
    return args[1] + '-' + args[2].toLowerCase()
  })
@@ -300,8 +258,11 @@ export const measureText = (text, { italic, bold, fontSize, fontFamily }) => {
  }
  measureTextContext.save()
  measureTextContext.font = font
-  const { width, actualBoundingBoxAscent, actualBoundingBoxDescent } =
-    measureTextContext.measureText(text)
+  const {
+    width,
+    actualBoundingBoxAscent,
+    actualBoundingBoxDescent
+  } = measureTextContext.measureText(text)
  measureTextContext.restore()
  const height = actualBoundingBoxAscent + actualBoundingBoxDescent
  return { width, height }
@@ -309,9 +270,7 @@ export const measureText = (text, { italic, bold, fontSize, fontFamily }) => {

 // 拼接font字符串
 export const joinFontStr = ({ italic, bold, fontSize, fontFamily }) => {
-  return `${italic ? 'italic ' : ''} ${
-    bold ? 'bold ' : ''
-  } ${fontSize}px ${fontFamily} `
+  return `${italic ? 'italic ' : ''} ${bold ? 'bold ' : ''} ${fontSize}px ${fontFamily} `
 }

 //  在下一个事件循环里执行任务
@@ -377,7 +336,7 @@ export const checkNodeOuter = (mindMap, node) => {

 // 提取html字符串里的纯文本
 let getTextFromHtmlEl = null
-export const getTextFromHtml = html => {
+export const getTextFromHtml = (html) => {
  if (!getTextFromHtmlEl) {
    getTextFromHtmlEl = document.createElement('div')
  }
@@ -386,133 +345,15 @@ export const getTextFromHtml = html => {
 }

 // 将blob转成data:url
-export const readBlob = blob => {
+export const readBlob = (blob) => {
  return new Promise((resolve, reject) => {
    let reader = new FileReader()
-    reader.onload = evt => {
+    reader.onload = (evt) => {
      resolve(evt.target.result)
    }
-    reader.onerror = err => {
+    reader.onerror = (err) => {
      reject(err)
    }
    reader.readAsDataURL(blob)
  })
-}
-
-// 将dom节点转换成html字符串
-let nodeToHTMLWrapEl = null
-export const nodeToHTML = node => {
-  if (!nodeToHTMLWrapEl) {
-    nodeToHTMLWrapEl = document.createElement('div')
-  }
-  nodeToHTMLWrapEl.innerHTML = ''
-  nodeToHTMLWrapEl.appendChild(node)
-  return nodeToHTMLWrapEl.innerHTML
-}
-
-// 获取图片大小
-export const getImageSize = src => {
-  return new Promise(resolve => {
-    let img = new Image()
-    img.src = src
-    img.onload = () => {
-      resolve({
-        width: img.width,
-        height: img.height
-      })
-    }
-    img.onerror = () => {
-      resolve({
-        width: 0,
-        height: 0
-      })
-    }
-  })
-}
-
-// 创建节点唯一的id
-export const createUid = () => {
-  return uuidv4()
-}
-
-// 加载图片文件
-export const loadImage = imgFile => {
-  return new Promise((resolve, reject) => {
-    let fr = new FileReader()
-    fr.readAsDataURL(imgFile)
-    fr.onload = async e => {
-      let url = e.target.result
-      let size = await getImageSize(url)
-      resolve({
-        url,
-        size
-      })
-    }
-    fr.onerror = error => {
-      reject(error)
-    }
-  })
-}
-
-// 移除字符串中的html实体
-export const removeHTMLEntities = (str) => {
-  [['&nbsp;', '&#160;']].forEach((item) => {
-    str = str.replaceAll(item[0], item[1])
-  })
-  return str
-}
-
-// 获取一个数据的类型
-export const getType = (data) => {
-  return Object.prototype.toString.call(data).slice(7, -1)
-}
-
-// 判断一个数据是否是null和undefined和空字符串
-export const isUndef = (data) => {
-  return data === null || data === undefined || data === ''
-}
-
-// 移除html字符串中节点的内联样式
-export const removeHtmlStyle = (html) => {
-  return html.replaceAll(/(<[^\s]+)\s+style=["'][^'"]+["']\s*(>)/g, '$1$2')
-}
-
-// 给html标签中指定的标签添加内联样式
-export const addHtmlStyle = (html, tag, style) => {
-  const reg = new RegExp(`(<${tag}[^>]*)(>[^<>]*</${tag}>)`, 'g')
-  return html.replaceAll(reg, `$1 style="${style}"$2`)
-}
-
-// 检查一个字符串是否是富文本字符
-let checkIsRichTextEl = null
-export const checkIsRichText = (str) => {
-  if (!checkIsRichTextEl) {
-    checkIsRichTextEl = document.createElement('div')
-  }
-  checkIsRichTextEl.innerHTML = str
-  for (let c = checkIsRichTextEl.childNodes, i = c.length; i--;) {
-    if (c[i].nodeType == 1) return true
-  }
-  return false
-}
-
-// 搜索和替换html字符串中指定的文本
-let replaceHtmlTextEl = null
-export const replaceHtmlText = (html, searchText, replaceText) => {
-  if (!replaceHtmlTextEl) {
-    replaceHtmlTextEl = document.createElement('div')
-  }
-  replaceHtmlTextEl.innerHTML = html
-  let walk = (root) => {
-    let childNodes = root.childNodes
-    childNodes.forEach((node) => {
-      if (node.nodeType === 1) {// 元素节点
-        walk(node)
-      } else if (node.nodeType === 3) {// 文本节点
-        root.replaceChild(document.createTextNode(node.nodeValue.replaceAll(searchText, replaceText)), node)
-      }
-    })
-  }
-  walk(replaceHtmlTextEl)
-  return replaceHtmlTextEl.innerHTML
 }
--- a/simple-mind-map/src/core/command/keyMap.js
+++ b/simple-mind-map/src/core/command/keyMap.js
--- a/simple-mind-map/src/core/render/node/nodeCommandWraps.js
+++ b/simple-mind-map/src/core/render/node/nodeCommandWraps.js
@@ -4,8 +4,8 @@ function setData(data = {}) {
 }

 //  设置文本
-function setText(text, richText, resetRichText) {
-  this.mindMap.execCommand('SET_NODE_TEXT', this, text, richText, resetRichText)
+function setText(text, richText) {
+  this.mindMap.execCommand('SET_NODE_TEXT', this, text, richText)
 }

 //  设置图片
--- a/simple-mind-map/src/core/render/node/nodeCreateContents.js
+++ b/simple-mind-map/src/core/render/node/nodeCreateContents.js
@@ -1,7 +1,7 @@
-import { measureText, resizeImgSize, removeHtmlStyle, addHtmlStyle, checkIsRichText } from '../../../utils'
+import { measureText, resizeImgSize, getTextFromHtml } from '../utils'
 import { Image, SVG, A, G, Rect, Text, ForeignObject } from '@svgdotjs/svg.js'
-import iconsSvg from '../../../svg/icons'
-import { CONSTANTS, commonCaches } from '../../../constants/constant'
+import iconsSvg from '../svg/icons'
+import { CONSTANTS } from './constant'

 //  创建图片节点
 function createImgNode() {
@@ -17,15 +17,6 @@ function createImgNode() {
  node.on('dblclick', e => {
    this.mindMap.emit('node_img_dblclick', this, e)
  })
-  node.on('mouseenter', e => {
-    this.mindMap.emit('node_img_mouseenter', this, node, e)
-  })
-  node.on('mouseleave', e => {
-    this.mindMap.emit('node_img_mouseleave', this, node, e)
-  })
-  node.on('mousemove', e => {
-    this.mindMap.emit('node_img_mousemove', this, node, e)
-  })
  return {
    node,
    width: imgSize[0],
@@ -35,12 +26,9 @@ function createImgNode() {

 //  获取图片显示宽高
 function getImgShowSize() {
-  const { custom, width, height } = this.nodeData.data.imageSize
-  // 如果是自定义了图片的宽高，那么不受最大宽高限制
-  if (custom) return [width, height]
  return resizeImgSize(
-    width,
-    height,
+    this.nodeData.data.imageSize.width,
+    this.nodeData.data.imageSize.height,
    this.mindMap.themeConfig.imgMaxWidth,
    this.mindMap.themeConfig.imgMaxHeight
  )
@@ -64,9 +52,6 @@ function createIconNode() {
      node = new Image().load(src)
    }
    node.size(iconSize, iconSize)
-    node.on('click', e => {
-      this.mindMap.emit('node_icon_click', this, item, e)
-    })
    return {
      node,
      width: iconSize,
@@ -79,33 +64,10 @@ function createIconNode() {
 function createRichTextNode() {
  let g = new G()
  // 重新设置富文本节点内容
-  let recoverText = false
-  if (this.nodeData.data.resetRichText) {
+  if (this.nodeData.data.resetRichText || [CONSTANTS.CHANGE_THEME].includes(this.mindMap.renderer.renderSource)) {
    delete this.nodeData.data.resetRichText
-    recoverText = true
-  }
-  if ([CONSTANTS.CHANGE_THEME].includes(this.mindMap.renderer.renderSource)) {
-    // 如果自定义过样式则不允许覆盖
-    if (!this.hasCustomStyle()) {
-      recoverText = true
-    }
-  }
-  if (recoverText) {
-    let text = this.nodeData.data.text
-    // 判断节点内容是否是富文本
-    let isRichText = checkIsRichText(text)
-    // 样式字符串
-    let style = this.style.createStyleText()
-    if (isRichText) {
-      // 如果是富文本那么线移除内联样式
-      text = removeHtmlStyle(text)
-      // 再添加新的内联样式
-      text = addHtmlStyle(text, 'span', style)
-    } else {
-      // 非富文本
-      text = `<p><span style="${style}">${text}</span></p>`
-    }
-    this.nodeData.data.text = text
+    let text = getTextFromHtml(this.nodeData.data.text)
+    this.nodeData.data.text = `<p><span style="${this.style.createStyleText()}">${text}</span></p>`
  }
  let html = `<div>${this.nodeData.data.text}</div>`
  let div = document.createElement('div')
@@ -117,7 +79,7 @@ function createRichTextNode() {
  el.style.maxWidth = this.mindMap.opt.textAutoWrapWidth + 'px'
  this.mindMap.el.appendChild(div)
  let { width, height } = el.getBoundingClientRect()
-  width = Math.ceil(width) + 1// 修复getBoundingClientRect方法对实际宽度是小数的元素获取到的值是整数，导致宽度不够文本发生换行的问题
+  width = Math.ceil(width)
  height = Math.ceil(height)
  g.attr('data-width', width)
  g.attr('data-height', height)
@@ -308,31 +270,6 @@ function createNoteNode() {
  }
 }

-// 测量自定义节点内容元素的宽高
-function measureCustomNodeContentSize (content) {
-  if (!commonCaches.measureCustomNodeContentSizeEl) {
-    commonCaches.measureCustomNodeContentSizeEl = document.createElement('div')
-    commonCaches.measureCustomNodeContentSizeEl.style.cssText = `
-      position: fixed;
-      left: -99999px;
-      top: -99999px;
-    `
-    this.mindMap.el.appendChild(commonCaches.measureCustomNodeContentSizeEl)
-  }
-  commonCaches.measureCustomNodeContentSizeEl.innerHTML = ''
-  commonCaches.measureCustomNodeContentSizeEl.appendChild(content)
-  let rect = commonCaches.measureCustomNodeContentSizeEl.getBoundingClientRect()
-  return {
-    width: rect.width,
-    height: rect.height
-  }
-}
-
-// 是否使用的是自定义节点内容
-function isUseCustomNodeContent()  {
-  return !!this._customNodeContent
-}
-
 export default {
    createImgNode,
    getImgShowSize,
@@ -341,7 +278,5 @@ export default {
    createTextNode,
    createHyperlinkNode,
    createTagNode,
-    createNoteNode,
-    measureCustomNodeContentSize,
-    isUseCustomNodeContent
+    createNoteNode
 }
--- a/simple-mind-map/src/core/render/node/nodeExpandBtn.js
+++ b/simple-mind-map/src/core/render/node/nodeExpandBtn.js
@@ -1,4 +1,4 @@
-import btnsSvg from '../../../svg/btns'
+import btnsSvg from '../svg/btns'
 import { SVG, Circle, G } from '@svgdotjs/svg.js'

 // 创建展开收起按钮的内容节点
--- a/simple-mind-map/src/core/render/node/nodeGeneralization.js
+++ b/simple-mind-map/src/core/render/node/nodeGeneralization.js
@@ -1,5 +1,4 @@
-import Node from './Node'
-import { createUid } from '../../../utils/index'
+import Node from '../Node'

 //  检查是否存在概要
 function checkHasGeneralization () {
@@ -19,7 +18,7 @@ function createGeneralizationNode () {
      data: {
        data: this.nodeData.data.generalization
      },
-      uid: createUid(),
+      uid: this.mindMap.uid++,
      renderer: this.renderer,
      mindMap: this.mindMap,
      draw: this.draw,
@@ -36,14 +35,15 @@ function createGeneralizationNode () {

 //  更新概要节点
 function updateGeneralization () {
-  if (this.isGeneralization) return
  this.removeGeneralization()
  this.createGeneralizationNode()
 }

 //  渲染概要节点
 function renderGeneralization () {
-  if (this.isGeneralization) return
+  if (this.isGeneralization) {
+    return
+  }
  if (!this.checkHasGeneralization()) {
    this.removeGeneralization()
    this._generalizationNodeWidth = 0
@@ -66,7 +66,6 @@ function renderGeneralization () {

 //  删除概要节点
 function removeGeneralization () {
-  if (this.isGeneralization) return
  if (this._generalizationLine) {
    this._generalizationLine.remove()
    this._generalizationLine = null
@@ -87,7 +86,6 @@ function removeGeneralization () {

 //  隐藏概要节点
 function hideGeneralization () {
-  if (this.isGeneralization) return
  if (this._generalizationLine) {
    this._generalizationLine.hide()
  }
@@ -98,7 +96,6 @@ function hideGeneralization () {

 //  显示概要节点
 function showGeneralization () {
-  if (this.isGeneralization) return
  if (this._generalizationLine) {
    this._generalizationLine.show()
  }
--- a/web/build/icons/icon.icns
+++ b/web/build/icons/icon.icns
--- a/web/build/icons/icon.ico
+++ b/web/build/icons/icon.ico
--- a/web/build/icons/icon.png
+++ b/web/build/icons/icon.png
--- a/web/dist_electron/index.js
+++ b/web/dist_electron/index.js
--- a/web/dist_electron/package.json
+++ b/web/dist_electron/package.json
@@ -0,0 +1,84 @@
+{
+  "name": "thoughts",
+  "version": "0.1.0",
+  "private": true,
+  "description": "一个简洁的思维导图",
+  "author": "街角小林<1013335014@qq.com>",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/wanglin2/mind-map"
+  },
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build && node ../copy.js",
+    "lint": "vue-cli-service lint",
+    "autoBuildDoc": "node ./scripts/autoBuildDoc.js",
+    "buildDoc": "node ./scripts/buildDoc.js",
+    "electron:build": "vue-cli-service electron:build",
+    "electron:build-all": "vue-cli-service electron:build -p never -mwl",
+    "electron:build-mac": "vue-cli-service electron:build -p never -m",
+    "electron:build-win": "vue-cli-service electron:build -p never -w",
+    "electron:build-linux": "vue-cli-service electron:build -p never -l",
+    "electron:serve": "vue-cli-service electron:serve",
+    "buildLibrary": "vue-cli-service build --target lib --name simpleMindMap ../simple-mind-map/full.js --dest ../simple-mind-map/dist && esbuild ../simple-mind-map/full.js --bundle --external:buffer --format=esm --outfile=../simple-mind-map/dist/simpleMindMap.esm.js",
+    "format": "prettier --write src/* src/*/* src/*/*/* src/*/*/*/*",
+    "postinstall": "electron-builder install-app-deps",
+    "postuninstall": "electron-builder install-app-deps"
+  },
+  "main": "background.js",
+  "dependencies": {
+    "@toast-ui/editor": "^3.1.5",
+    "core-js": "^3.6.5",
+    "electron-json-storage": "^4.6.0",
+    "element-ui": "^2.15.1",
+    "fs-extra": "^7.0.1",
+    "highlight.js": "^10.7.3",
+    "open": "^6.4.0",
+    "uuid": "^3.4.0",
+    "v-viewer": "^1.6.4",
+    "vue": "^2.6.11",
+    "vue-i18n": "^8.27.2",
+    "vue-router": "^3.5.1",
+    "vuex": "^3.6.2",
+    "xlsx": "^0.18.5"
+  },
+  "devDependencies": {
+    "@vue/cli-plugin-babel": "^4.5.0",
+    "@vue/cli-plugin-eslint": "^4.5.0",
+    "@vue/cli-service": "^4.5.0",
+    "babel-eslint": "^10.1.0",
+    "chokidar": "^3.5.3",
+    "electron": "^23.1.1",
+    "electron-devtools-installer": "^3.1.0",
+    "esbuild": "^0.17.15",
+    "eslint": "^6.7.2",
+    "eslint-plugin-vue": "^6.2.2",
+    "less": "^3.12.2",
+    "less-loader": "^7.1.0",
+    "markdown-it": "^13.0.1",
+    "markdown-it-checkbox": "^1.1.0",
+    "prettier": "^1.19.1",
+    "vue-cli-plugin-electron-builder": "~2.1.1",
+    "vue-template-compiler": "^2.6.11",
+    "webpack": "^4.44.2"
+  },
+  "eslintConfig": {
+    "root": true,
+    "env": {
+      "node": true
+    },
+    "extends": [
+      "plugin:vue/essential",
+      "eslint:recommended"
+    ],
+    "parserOptions": {
+      "parser": "babel-eslint"
+    },
+    "rules": {}
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead"
+  ]
+}
--- a/web/dist_electron/preload.js
+++ b/web/dist_electron/preload.js
@@ -0,0 +1,122 @@
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 0);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ "./src/electron/preload.js":
+/*!*********************************!*\
+  !*** ./src/electron/preload.js ***!
+  \*********************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+eval("const { contextBridge, ipcRenderer } = __webpack_require__(/*! electron */ \"electron\")\r\n\r\ncontextBridge.exposeInMainWorld('platform', process.platform)\r\ncontextBridge.exposeInMainWorld('IS_ELECTRON', true)\r\n\r\ncontextBridge.exposeInMainWorld('electronAPI', {\r\n  minimize: () => ipcRenderer.send('minimize'),\r\n  maximize: () => ipcRenderer.send('maximize'),\r\n  unmaximize: () => ipcRenderer.send('unmaximize'),\r\n  close: () => ipcRenderer.send('close'),\r\n  destroy: () => ipcRenderer.send('destroy'),\r\n  create: id => ipcRenderer.send('create', id),\r\n  getFileContent: id => ipcRenderer.invoke('getFileContent', id),\r\n  save: (id, data, fileName) => ipcRenderer.invoke('save', id, data, fileName),\r\n  rename: (id, name) => ipcRenderer.invoke('rename', id, name),\r\n  openUrl: url => ipcRenderer.send('openUrl', url),\r\n  addRecentFileList: (fileList) => ipcRenderer.invoke('addRecentFileList', fileList),\r\n  getRecentFileList: () => ipcRenderer.invoke('getRecentFileList'),\r\n  clearRecentFileList: () => ipcRenderer.invoke('clearRecentFileList'),\r\n  openFileInDir: file => ipcRenderer.send('openFileInDir', file),\r\n  deleteFile: file => ipcRenderer.invoke('deleteFile', file),\r\n  onRefreshRecentFileList: callback =>\r\n    ipcRenderer.on('refreshRecentFileList', callback),\r\n  openFile: file => ipcRenderer.send('openFile', file),\r\n  selectOpenFile: () => ipcRenderer.send('selectOpenFile'),\r\n  copyFile: file => ipcRenderer.invoke('copyFile', file)\r\n})\r\n\n\n//# sourceURL=webpack:///./src/electron/preload.js?");
+
+/***/ }),
+
+/***/ 0:
+/*!***************************************!*\
+  !*** multi ./src/electron/preload.js ***!
+  \***************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+eval("module.exports = __webpack_require__(/*! E:\\wanglin\\mind-map\\web\\src\\electron\\preload.js */\"./src/electron/preload.js\");\n\n\n//# sourceURL=webpack:///multi_./src/electron/preload.js?");
+
+/***/ }),
+
+/***/ "electron":
+/*!***************************!*\
+  !*** external "electron" ***!
+  \***************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+eval("module.exports = require(\"electron\");\n\n//# sourceURL=webpack:///external_%22electron%22?");
+
+/***/ })
+
+/******/ });
--- a/web/package-lock.json
+++ b/web/package-lock.json
--- a/web/package.json
+++ b/web/package.json
@@ -2,21 +2,39 @@
  "name": "thoughts",
  "version": "0.1.0",
  "private": true,
+  "description": "一个简洁的思维导图",
+  "author": "街角小林<1013335014@qq.com>",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/wanglin2/mind-map"
+  },
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build && node ../copy.js",
    "lint": "vue-cli-service lint",
-    "buildLibrary": "vue-cli-service build --target lib --name simpleMindMap ../simple-mind-map/full.js --dest ../simple-mind-map/dist && esbuild ../simple-mind-map/full.js --bundle --external:buffer --format=esm --outfile=../simple-mind-map/dist/simpleMindMap.esm.js && esbuild ../simple-mind-map/full.js --bundle --minify --external:buffer --format=esm --outfile=../simple-mind-map/dist/simpleMindMap.esm.min.js",
-    "format": "prettier --write src/* src/*/* src/*/*/* src/*/*/*/*",
-    "buildDoc": "node ./scripts/buildDoc.js",
    "autoBuildDoc": "node ./scripts/autoBuildDoc.js",
-    "createNodeImageList": "node ./scripts/createNodeImageList.js"
+    "buildDoc": "node ./scripts/buildDoc.js",
+    "electron:build": "vue-cli-service electron:build",
+    "electron:build-all": "vue-cli-service electron:build -p never -mwl",
+    "electron:build-mac": "vue-cli-service electron:build -p never -m",
+    "electron:build-win": "vue-cli-service electron:build -p never -w",
+    "electron:build-linux": "vue-cli-service electron:build -p never -l",
+    "electron:serve": "vue-cli-service electron:serve",
+    "buildLibrary": "vue-cli-service build --target lib --name simpleMindMap ../simple-mind-map/full.js --dest ../simple-mind-map/dist && esbuild ../simple-mind-map/full.js --bundle --external:buffer --format=esm --outfile=../simple-mind-map/dist/simpleMindMap.esm.js",
+    "format": "prettier --write src/* src/*/* src/*/*/* src/*/*/*/*",
+    "postinstall": "electron-builder install-app-deps",
+    "postuninstall": "electron-builder install-app-deps"
  },
+  "main": "background.js",
  "dependencies": {
    "@toast-ui/editor": "^3.1.5",
    "core-js": "^3.6.5",
+    "electron-json-storage": "^4.6.0",
    "element-ui": "^2.15.1",
+    "fs-extra": "^7.0.1",
    "highlight.js": "^10.7.3",
+    "open": "^6.4.0",
+    "uuid": "^3.4.0",
    "v-viewer": "^1.6.4",
    "vue": "^2.6.11",
    "vue-i18n": "^8.27.2",
@@ -30,6 +48,8 @@
    "@vue/cli-service": "^4.5.0",
    "babel-eslint": "^10.1.0",
    "chokidar": "^3.5.3",
+    "electron": "^23.1.1",
+    "electron-devtools-installer": "^3.1.0",
    "esbuild": "^0.17.15",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
@@ -38,7 +58,7 @@
    "markdown-it": "^13.0.1",
    "markdown-it-checkbox": "^1.1.0",
    "prettier": "^1.19.1",
-    "vconsole": "^3.15.1",
+    "vue-cli-plugin-electron-builder": "~2.1.1",
    "vue-template-compiler": "^2.6.11",
    "webpack": "^4.44.2"
  },
--- a/web/public/index.html
+++ b/web/public/index.html
@@ -3,9 +3,9 @@
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
-    <link rel="icon" href="./dist/logo.ico">
-    <title>思绪思维导图</title>
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="./dist/logo.png">
+    <title>一个简单的web思维导图实现</title>
  </head>
  <body>
    <noscript>
--- a/web/public/logo.ico
+++ b/web/public/logo.ico
--- a/web/scripts/createNodeImageList.js
+++ b/web/scripts/createNodeImageList.js
@@ -1,50 +0,0 @@
-const path = require('path')
-const fs = require('fs')
-
-const fileDest = path.join(__dirname, '../src/assets/svg')
-const targetDest = path.join(__dirname, '../src/config/image.js')
-
-const run = (dir) => {
-    let dirs = fs.readdirSync(dir)
-    dirs.forEach(item => {
-        let cur = path.join(dir, item)
-        if (fs.statSync(cur).isDirectory()) {
-            walkDir(cur, item)
-        }
-    })
-}
-
-const list = []
-const importList = []
-const walkDir = (dir, item) => {
-    let files = fs.readdirSync(dir)
-    let name = files.find((file) => {
-        return !/\./.test(file)
-    })
-    let fileList = files.filter((file) => {
-        return /\.svg$/.test(file)
-    })
-    let itemList = []
-    fileList.forEach((file) => {
-        let fileName = item + '_' + file.replace(/\.svg$/, '').replaceAll('-', '')
-        importList.push(`import ${fileName} from '../assets/svg/${item}/${file}'`)
-        itemList.push({
-            url: fileName,
-            width: 100,
-            height: 100
-        })
-    })
-    list.push({
-        name,
-        list: itemList
-    })
-    const content = `
-// 该文件请运行npm run createNodeImageList命令自动生成
-${importList.join('\n')}
-export default ${JSON.stringify(list, null, 2).replace(/(url":\s*)"([^"]+)"(,)/g, '$1$2$3')}
-`
-    fs.writeFileSync(targetDest, content)
-}
-
-run(fileDest)
-console.log('运行成功')
--- a/web/src/.DS_Store
+++ b/web/src/.DS_Store
--- a/web/src/api/index.js
+++ b/web/src/api/index.js
@@ -34,7 +34,17 @@ export const getData = () => {
    return simpleDeepClone(exampleData)
  } else {
    try {
-      return JSON.parse(store)
+      let parsedData = JSON.parse(store)
+      if (window.IS_ELECTRON) {
+        return simpleDeepClone(exampleData)
+        let { root, ...rest } = parsedData
+        return {
+          ...rest,
+          root: simpleDeepClone(exampleData).root
+        }
+      } else {
+        return parsedData
+      } 
    } catch (error) {
      return simpleDeepClone(exampleData)
    }
--- a/web/src/assets/.DS_Store
+++ b/web/src/assets/.DS_Store
--- a/web/src/assets/avatar/Chris.jpg
+++ b/web/src/assets/avatar/Chris.jpg
--- a/web/src/assets/avatar/ZXR.jpg
+++ b/web/src/assets/avatar/ZXR.jpg
--- a/web/src/assets/avatar/default.png
+++ b/web/src/assets/avatar/default.png
--- a/web/src/assets/avatar/qp.jpg
+++ b/web/src/assets/avatar/qp.jpg
--- a/web/src/assets/avatar/suka.jpg
+++ b/web/src/assets/avatar/suka.jpg
--- a/web/src/assets/avatar/仓鼠.jpg
+++ b/web/src/assets/avatar/仓鼠.jpg
--- a/web/src/assets/avatar/千帆.jpg
+++ b/web/src/assets/avatar/千帆.jpg
--- a/web/src/assets/avatar/小土渣的宇宙.jpeg
+++ b/web/src/assets/avatar/小土渣的宇宙.jpeg
--- a/web/src/assets/avatar/志斌.jpg
+++ b/web/src/assets/avatar/志斌.jpg
--- a/web/src/assets/avatar/水车.jpg
+++ b/web/src/assets/avatar/水车.jpg
--- a/web/src/assets/avatar/花儿朵朵.jpg
+++ b/web/src/assets/avatar/花儿朵朵.jpg
--- a/web/src/assets/icon-font/iconfont.css
+++ b/web/src/assets/icon-font/iconfont.css
@@ -1,8 +1,8 @@
@font-face {
  font-family: "iconfont"; /* Project id 2479351 */
-  src: url('iconfont.woff2?t=1690537337895') format('woff2'),
-       url('iconfont.woff?t=1690537337895') format('woff'),
-       url('iconfont.ttf?t=1690537337895') format('truetype');
+  src: url('iconfont.woff2?t=1679621707211') format('woff2'),
+       url('iconfont.woff?t=1679621707211') format('woff'),
+       url('iconfont.ttf?t=1679621707211') format('truetype');
 }

 .iconfont {
@@ -13,78 +13,6 @@
  -moz-osx-font-smoothing: grayscale;
 }

-.iconlieri:before {
-  content: "\e60b";
-}
-
-.iconmoon_line:before {
-  content: "\e745";
-}
-
-.iconsousuo:before {
-  content: "\e693";
-}
-
-.iconjiantouyou:before {
-  content: "\e62d";
-}
-
-.iconbianji1:before {
-  content: "\e60a";
-}
-
-.icondaohang1:before {
-  content: "\e632";
-}
-
-.iconyanjing:before {
-  content: "\e8bf";
-}
-
-.iconwangzhan:before {
-  content: "\e628";
-}
-
-.iconcsdn:before {
-  content: "\e608";
-}
-
-.iconshejiaotubiao-10:before {
-  content: "\e644";
-}
-
-.iconstar:before {
-  content: "\e7df";
-}
-
-.iconfork:before {
-  content: "\e641";
-}
-
-.iconxiazai:before {
-  content: "\e613";
-}
-
-.iconteamwork:before {
-  content: "\e870";
-}
-
-.iconshuiyin:before {
-  content: "\e67a";
-}
-
-.iconxmind:before {
-  content: "\ea57";
-}
-
-.iconmouseR:before {
-  content: "\e6bd";
-}
-
-.iconmouseL:before {
-  content: "\e6c0";
-}
-
 .iconwenjian:before {
  content: "\e607";
 }
--- a/web/src/assets/icon-font/iconfont.ttf
+++ b/web/src/assets/icon-font/iconfont.ttf
--- a/web/src/assets/icon-font/iconfont.woff
+++ b/web/src/assets/icon-font/iconfont.woff
--- a/web/src/assets/icon-font/iconfont.woff2
+++ b/web/src/assets/icon-font/iconfont.woff2
--- a/web/src/assets/img/block1.png
+++ b/web/src/assets/img/block1.png
--- a/web/src/assets/img/block3.png
+++ b/web/src/assets/img/block3.png
--- a/web/src/assets/img/block4.png
+++ b/web/src/assets/img/block4.png
--- a/web/src/assets/img/catalogOrganization.png
+++ b/web/src/assets/img/catalogOrganization.png
--- a/web/src/assets/img/fishbone.png
+++ b/web/src/assets/img/fishbone.png
--- a/web/src/assets/img/icon.png
+++ b/web/src/assets/img/icon.png
--- a/web/src/assets/img/logicalStructure.png
+++ b/web/src/assets/img/logicalStructure.png
--- a/web/src/assets/img/logo2.png
+++ b/web/src/assets/img/logo2.png
--- a/web/src/assets/img/mindMap.png
+++ b/web/src/assets/img/mindMap.png
--- a/web/src/assets/img/organizationStructure.png
+++ b/web/src/assets/img/organizationStructure.png
--- a/web/src/assets/img/split.png
+++ b/web/src/assets/img/split.png
--- a/web/src/assets/img/timeline.png
+++ b/web/src/assets/img/timeline.png
--- a/web/src/assets/img/timeline2.png
+++ b/web/src/assets/img/timeline2.png
--- a/web/src/assets/img/verticalTimeline.jpg
+++ b/web/src/assets/img/verticalTimeline.jpg
--- a/web/src/assets/img/verticalTimeline.png
+++ b/web/src/assets/img/verticalTimeline.png
--- a/web/src/assets/svg/business/-.svg
+++ b/web/src/assets/svg/business/-.svg
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
wanglin2	c789a95e4e	支持直接双击文件打开应用进入编辑	2023-05-05 17:37:01 +08:00
wanglin2	b0532072c2	修改打包配置	2023-05-05 16:59:39 +08:00
wanglin2	7d21ae4618	打包	2023-05-05 16:04:15 +08:00
wanglin2	0e608de9da	基本完成	2023-05-05 14:55:01 +08:00
wanglin2	fbff68c635	开发中	2023-05-05 10:51:39 +08:00
wanglin2	ec9517c491	开发中	2023-05-04 22:40:44 +08:00
wanglin2	26e3158bd8	开发中	2023-05-04 17:54:31 +08:00
wanglin2	c2c9de1c03	更新	2023-05-03 22:06:52 +08:00
wanglin2	27d2238d20	更新	2023-05-03 21:26:13 +08:00
wanglin2	d6e625efa6	日常提交	2023-03-14 09:40:09 +08:00
wanglin2	fba0ece8fd	合并主分支	2023-03-08 09:47:35 +08:00
wanglin2	78ed038012	重新设计客户端架构	2023-03-07 16:39:33 +08:00
wanglin2	58f7be77ed	Merge branch 'main' into electron	2023-03-06 21:56:30 +08:00
wanglin2	362160c67b	使用Vue CLI Plugin Electron Builder插件	2023-03-06 21:29:59 +08:00
wanglin2	c8a3c569e1	新增electron相关页面	2023-03-06 20:59:00 +08:00
wanglin2	6bc309e3fa	增加图标	2023-03-06 20:57:55 +08:00