diff --git a/simple-mind-map/index.js b/simple-mind-map/index.js
index 83420a66..f5451a48 100644
--- a/simple-mind-map/index.js
+++ b/simple-mind-map/index.js
@@ -9,7 +9,6 @@ import Command from './src/Command'
 import BatchExecution from './src/BatchExecution'
 import Export from './src/Export'
 import Select from './src/Select'
-import Drag from './src/Drag'
 import { layoutValueList } from './src/utils/constant'
 import { SVG } from '@svgdotjs/svg.js'
 import { simpleDeepClone } from './src/utils'
@@ -127,11 +126,6 @@ class MindMap {
       mindMap: this
     })
 
-    // 拖动类
-    this.drag = new Drag({
-      mindMap: this
-    })
-
     // 键盘导航类
     this.keyboardNavigation = new KeyboardNavigation({
       mindMap: this
diff --git a/web/src/pages/Doc/catalogList.js b/web/src/pages/Doc/catalogList.js
index d651c9d7..4364435c 100644
--- a/web/src/pages/Doc/catalogList.js
+++ b/web/src/pages/Doc/catalogList.js
@@ -23,6 +23,7 @@ let APIList = [
   'keyboardNavigation',
   'command',
   'select',
+  'drag',
   'batchExecution',
   'xmind',
   'utils'
diff --git a/web/src/pages/Doc/en/drag/index.md b/web/src/pages/Doc/en/drag/index.md
new file mode 100644
index 00000000..dbfc65a7
--- /dev/null
+++ b/web/src/pages/Doc/en/drag/index.md
@@ -0,0 +1,21 @@
+# Drag plugin
+
+The `Drag` plugin provides the function of node dragging, including:
+
+1.Drag the node to move and change its position in the node tree, That is, as a child node, sibling node, etc. of other nodes
+
+2.Drag the node to the custom canvas location
+
+Please refer to the [Instantiation Options](/mind-map/#/doc/zh/constructor) of the `MindMap` class for configuration.
+
+## Register
+
+```js
+import MindMap from 'simple-mind-map'
+import Drag from 'simple-mind-map/src/Drag.js'
+
+MindMap.usePlugin(Drag)
+```
+
+After registration and instantiation of `MindMap`, the instance can be obtained through `mindMap.drag`.
+
diff --git a/web/src/pages/Doc/en/drag/index.vue b/web/src/pages/Doc/en/drag/index.vue
new file mode 100644
index 00000000..a43ecba4
--- /dev/null
+++ b/web/src/pages/Doc/en/drag/index.vue
@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <h1>Drag plugin</h1>
+<p>The <code>Drag</code> plugin provides the function of node dragging, including:</p>
+<p>1.Drag the node to move and change its position in the node tree, That is, as a child node, sibling node, etc. of other nodes</p>
+<p>2.Drag the node to the custom canvas location</p>
+<p>Please refer to the <a href="/mind-map/#/doc/zh/constructor">Instantiation Options</a> of the <code>MindMap</code> class for configuration.</p>
+<h2>Register</h2>
+<pre class="hljs"><code><span class="hljs-keyword">import</span> MindMap <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map&#x27;</span>
+<span class="hljs-keyword">import</span> Drag <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map/src/Drag.js&#x27;</span>
+
+MindMap.usePlugin(Drag)
+</code></pre>
+<p>After registration and instantiation of <code>MindMap</code>, the instance can be obtained through <code>mindMap.drag</code>.</p>
+
+  </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file
diff --git a/web/src/pages/Doc/en/watermark/index.md b/web/src/pages/Doc/en/watermark/index.md
index 69b49a70..8d509a33 100644
--- a/web/src/pages/Doc/en/watermark/index.md
+++ b/web/src/pages/Doc/en/watermark/index.md
@@ -4,6 +4,8 @@
 
 `Watermark` instance is responsible for displaying the watermark.
 
+Please refer to the [Instantiation Options](/mind-map/#/doc/zh/constructor) of the `MindMap` class for configuration.
+
 ## Register
 
 ```js
diff --git a/web/src/pages/Doc/en/watermark/index.vue b/web/src/pages/Doc/en/watermark/index.vue
index 542d2a24..1677077d 100644
--- a/web/src/pages/Doc/en/watermark/index.vue
+++ b/web/src/pages/Doc/en/watermark/index.vue
@@ -5,6 +5,7 @@
 <p>0.2.24+</p>
 </blockquote>
 <p><code>Watermark</code> instance is responsible for displaying the watermark.</p>
+<p>Please refer to the <a href="/mind-map/#/doc/zh/constructor">Instantiation Options</a> of the <code>MindMap</code> class for configuration.</p>
 <h2>Register</h2>
 <pre class="hljs"><code><span class="hljs-keyword">import</span> MindMap <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map&#x27;</span>
 <span class="hljs-keyword">import</span> Watermark <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map/src/Watermark.js&#x27;</span>
diff --git a/web/src/pages/Doc/routerList.js b/web/src/pages/Doc/routerList.js
index bab0303a..98205eb8 100644
--- a/web/src/pages/Doc/routerList.js
+++ b/web/src/pages/Doc/routerList.js
@@ -1,3 +1,3 @@
 
-        export default [{"lang":"zh","children":[{"path":"batchExecution","title":"BatchExecution实例"},{"path":"changelog","title":"Changelog"},{"path":"command","title":"Command实例"},{"path":"constructor","title":"构造函数"},{"path":"doExport","title":"DoExport实例"},{"path":"introduction","title":"简介"},{"path":"keyboardNavigation","title":"KeyboardNavigation实例"},{"path":"keyCommand","title":"KeyCommand实例"},{"path":"miniMap","title":"MiniMap插件"},{"path":"node","title":"Node实例"},{"path":"render","title":"Render实例"},{"path":"select","title":"Select实例"},{"path":"start","title":"开始"},{"path":"translate","title":"参与翻译"},{"path":"utils","title":"内置工具方法"},{"path":"view","title":"View实例"},{"path":"watermark","title":"Watermark插件"},{"path":"xmind","title":"XMind解析"}]},{"lang":"en","children":[{"path":"batchExecution","title":"batchExecution instance"},{"path":"changelog","title":"Changelog"},{"path":"command","title":"command instance"},{"path":"constructor","title":"Constructor"},{"path":"doExport","title":"DoExport instance"},{"path":"introduction","title":"Introduction"},{"path":"keyboardNavigation","title":"KeyboardNavigation instance"},{"path":"keyCommand","title":"KeyCommand instance"},{"path":"miniMap","title":"MiniMap plugin"},{"path":"node","title":"Node instance"},{"path":"render","title":"Render instance"},{"path":"select","title":"Select instance"},{"path":"start","title":"Start"},{"path":"translate","title":"Participate in translation"},{"path":"utils","title":"Utility Methods"},{"path":"view","title":"View instance"},{"path":"watermark","title":"Watermark plugin"},{"path":"xmind","title":"XMind parse"}]}]
+        export default [{"lang":"zh","children":[{"path":"batchExecution","title":"BatchExecution实例"},{"path":"changelog","title":"Changelog"},{"path":"command","title":"Command实例"},{"path":"constructor","title":"构造函数"},{"path":"doExport","title":"DoExport实例"},{"path":"drag","title":"Drag插件"},{"path":"introduction","title":"简介"},{"path":"keyboardNavigation","title":"KeyboardNavigation实例"},{"path":"keyCommand","title":"KeyCommand实例"},{"path":"miniMap","title":"MiniMap插件"},{"path":"node","title":"Node实例"},{"path":"render","title":"Render实例"},{"path":"select","title":"Select实例"},{"path":"start","title":"开始"},{"path":"translate","title":"参与翻译"},{"path":"utils","title":"内置工具方法"},{"path":"view","title":"View实例"},{"path":"watermark","title":"Watermark插件"},{"path":"xmind","title":"XMind解析"}]},{"lang":"en","children":[{"path":"batchExecution","title":"batchExecution instance"},{"path":"changelog","title":"Changelog"},{"path":"command","title":"command instance"},{"path":"constructor","title":"Constructor"},{"path":"doExport","title":"DoExport instance"},{"path":"drag","title":"Drag plugin"},{"path":"introduction","title":"Introduction"},{"path":"keyboardNavigation","title":"KeyboardNavigation instance"},{"path":"keyCommand","title":"KeyCommand instance"},{"path":"miniMap","title":"MiniMap plugin"},{"path":"node","title":"Node instance"},{"path":"render","title":"Render instance"},{"path":"select","title":"Select instance"},{"path":"start","title":"Start"},{"path":"translate","title":"Participate in translation"},{"path":"utils","title":"Utility Methods"},{"path":"view","title":"View instance"},{"path":"watermark","title":"Watermark plugin"},{"path":"xmind","title":"XMind parse"}]}]
     
\ No newline at end of file
diff --git a/web/src/pages/Doc/zh/drag/index.md b/web/src/pages/Doc/zh/drag/index.md
new file mode 100644
index 00000000..6bfa1241
--- /dev/null
+++ b/web/src/pages/Doc/zh/drag/index.md
@@ -0,0 +1,21 @@
+# Drag插件
+
+`Drag`插件提供节点拖拽的功能，包括：
+
+1.拖拽节点进行移动，改变节点在节点树中的位置，即作为其他节点的子节点、兄弟节点等等
+
+2.拖拽节点到自定义的画布位置
+
+配置请参考`MindMap`类的[实例化选项](/mind-map/#/doc/zh/constructor)。
+
+## 注册
+
+```js
+import MindMap from 'simple-mind-map'
+import Drag from 'simple-mind-map/src/Drag.js'
+
+MindMap.usePlugin(Drag)
+```
+
+注册完且实例化`MindMap`后可通过`mindMap.drag`获取到该实例。
+
diff --git a/web/src/pages/Doc/zh/drag/index.vue b/web/src/pages/Doc/zh/drag/index.vue
new file mode 100644
index 00000000..c31f23d4
--- /dev/null
+++ b/web/src/pages/Doc/zh/drag/index.vue
@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <h1>Drag插件</h1>
+<p><code>Drag</code>插件提供节点拖拽的功能，包括：</p>
+<p>1.拖拽节点进行移动，改变节点在节点树中的位置，即作为其他节点的子节点、兄弟节点等等</p>
+<p>2.拖拽节点到自定义的画布位置</p>
+<p>配置请参考<code>MindMap</code>类的<a href="/mind-map/#/doc/zh/constructor">实例化选项</a>。</p>
+<h2>注册</h2>
+<pre class="hljs"><code><span class="hljs-keyword">import</span> MindMap <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map&#x27;</span>
+<span class="hljs-keyword">import</span> Drag <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map/src/Drag.js&#x27;</span>
+
+MindMap.usePlugin(Drag)
+</code></pre>
+<p>注册完且实例化<code>MindMap</code>后可通过<code>mindMap.drag</code>获取到该实例。</p>
+
+  </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file
diff --git a/web/src/pages/Doc/zh/watermark/index.md b/web/src/pages/Doc/zh/watermark/index.md
index 8a58daa2..66f75e92 100644
--- a/web/src/pages/Doc/zh/watermark/index.md
+++ b/web/src/pages/Doc/zh/watermark/index.md
@@ -4,6 +4,8 @@
 
 `Watermark`插件负责显示水印。
 
+配置请参考`MindMap`类的[实例化选项](/mind-map/#/doc/zh/constructor)。
+
 ## 注册
 
 ```js
diff --git a/web/src/pages/Doc/zh/watermark/index.vue b/web/src/pages/Doc/zh/watermark/index.vue
index e8972f74..09a4fdf0 100644
--- a/web/src/pages/Doc/zh/watermark/index.vue
+++ b/web/src/pages/Doc/zh/watermark/index.vue
@@ -5,6 +5,7 @@
 <p>0.2.24+</p>
 </blockquote>
 <p><code>Watermark</code>插件负责显示水印。</p>
+<p>配置请参考<code>MindMap</code>类的<a href="/mind-map/#/doc/zh/constructor">实例化选项</a>。</p>
 <h2>注册</h2>
 <pre class="hljs"><code><span class="hljs-keyword">import</span> MindMap <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map&#x27;</span>
 <span class="hljs-keyword">import</span> Watermark <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map/src/Watermark.js&#x27;</span>
diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue
index 5c524d8c..c8723c00 100644
--- a/web/src/pages/Edit/components/Edit.vue
+++ b/web/src/pages/Edit/components/Edit.vue
@@ -23,7 +23,8 @@
 <script>
 import MindMap from 'simple-mind-map'
 import MiniMap from 'simple-mind-map/src/MiniMap.js'
-import Watermark from 'simple-mind-map/src/Watermark.js';
+import Watermark from 'simple-mind-map/src/Watermark.js'
+import Drag from 'simple-mind-map/src/Drag.js'
 import Outline from './Outline'
 import Style from './Style'
 import BaseStyle from './BaseStyle'
@@ -45,6 +46,7 @@ import customThemeList from '@/customThemes'
 MindMap
   .usePlugin(MiniMap)
   .usePlugin(Watermark)
+  .usePlugin(Drag)
 
 // 注册自定义主题
 customThemeList.forEach((item) => {