diff --git a/simple-mind-map/index.js b/simple-mind-map/index.js
index b8bf6d85..74d017fa 100644
--- a/simple-mind-map/index.js
+++ b/simple-mind-map/index.js
@@ -126,7 +126,9 @@ const defaultOpt = {
   // 思维导图适应画布大小时的内边距
   fitPadding: 50,
   // 是否开启按住ctrl键多选节点功能
-  enableCtrlKeyNodeSelection: true
+  enableCtrlKeyNodeSelection: true,
+  // 设置为左键多选节点，右键拖动画布
+  useLeftKeySelectionRightKeyDrag: false
 }
 
 //  思维导图
diff --git a/simple-mind-map/src/core/event/Event.js b/simple-mind-map/src/core/event/Event.js
index 708209c4..67d7fb59 100644
--- a/simple-mind-map/src/core/event/Event.js
+++ b/simple-mind-map/src/core/event/Event.js
@@ -9,6 +9,7 @@ class Event extends EventEmitter {
     this.opt = opt
     this.mindMap = opt.mindMap
     this.isLeftMousedown = false
+    this.isRightMousedown = false
     this.mousedownPos = {
       x: 0,
       y: 0
@@ -89,6 +90,8 @@ 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
@@ -97,12 +100,17 @@ 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 (this.isLeftMousedown) {
+    if (
+      useLeftKeySelectionRightKeyDrag
+        ? this.isRightMousedown
+        : this.isLeftMousedown
+    ) {
       e.preventDefault()
       this.emit('drag', e, this)
     }
@@ -111,6 +119,7 @@ class Event extends EventEmitter {
   //  鼠标松开事件
   onMouseup(e) {
     this.isLeftMousedown = false
+    this.isRightMousedown = false
     this.emit('mouseup', e, this)
   }
 
diff --git a/simple-mind-map/src/plugins/Select.js b/simple-mind-map/src/plugins/Select.js
index 5181fd0c..b2a58c14 100644
--- a/simple-mind-map/src/plugins/Select.js
+++ b/simple-mind-map/src/plugins/Select.js
@@ -22,9 +22,14 @@ class Select {
       if (this.mindMap.opt.readonly) {
         return
       }
-      if (!e.ctrlKey && e.which !== 3) {
+      let { useLeftKeySelectionRightKeyDrag } = this.mindMap.opt
+      if (
+        !e.ctrlKey &&
+        (useLeftKeySelectionRightKeyDrag ? e.which !== 1 : e.which !== 3)
+      ) {
         return
       }
+      e.preventDefault()
       this.isMousedown = true
       let { x, y } = this.mindMap.toPos(e.clientX, e.clientY)
       this.mouseDownX = x
@@ -146,25 +151,24 @@ 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)
         // })
       }
     })
diff --git a/web/src/assets/icon-font/iconfont.css b/web/src/assets/icon-font/iconfont.css
index 5193dd1c..32a38dce 100644
--- 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=1679621707211') format('woff2'),
-       url('iconfont.woff?t=1679621707211') format('woff'),
-       url('iconfont.ttf?t=1679621707211') format('truetype');
+  src: url('iconfont.woff2?t=1686298427624') format('woff2'),
+       url('iconfont.woff?t=1686298427624') format('woff'),
+       url('iconfont.ttf?t=1686298427624') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.iconmouseR:before {
+  content: "\e6bd";
+}
+
+.iconmouseL:before {
+  content: "\e6c0";
+}
+
 .iconwenjian:before {
   content: "\e607";
 }
diff --git a/web/src/assets/icon-font/iconfont.ttf b/web/src/assets/icon-font/iconfont.ttf
index 2311cfcd..9ab744d3 100644
Binary files a/web/src/assets/icon-font/iconfont.ttf and b/web/src/assets/icon-font/iconfont.ttf differ
diff --git a/web/src/assets/icon-font/iconfont.woff b/web/src/assets/icon-font/iconfont.woff
index 1bdad3ba..a4e57c87 100644
Binary files a/web/src/assets/icon-font/iconfont.woff and b/web/src/assets/icon-font/iconfont.woff differ
diff --git a/web/src/assets/icon-font/iconfont.woff2 b/web/src/assets/icon-font/iconfont.woff2
index f3c1c366..487c6d0d 100644
Binary files a/web/src/assets/icon-font/iconfont.woff2 and b/web/src/assets/icon-font/iconfont.woff2 differ
diff --git a/web/src/lang/en_us.js b/web/src/lang/en_us.js
index e64f5ae7..7ea75351 100644
--- a/web/src/lang/en_us.js
+++ b/web/src/lang/en_us.js
@@ -202,5 +202,9 @@ export default {
   edit: {
     newFeatureNoticeTitle: 'New feature reminder',
     newFeatureNoticeMessage: 'This update supports node rich text editing, But there are some defects, The most important impact is that the time to export the image is proportional to the number of nodes, Therefore, if you are more dependent on export requirements, you can use【Base style】-【Other config】-【Enable node rich text editing】Set to turn off rich text editing mode.'
+  },
+  mouseAction: {
+    tip1: 'Current: Left click to drag the canvas, right click to box select nodes',
+    tip2: 'Current: Left click to box select nodes, right click to drag the canvas',
   }
 }
diff --git a/web/src/lang/zh_cn.js b/web/src/lang/zh_cn.js
index fcda058c..858de591 100644
--- a/web/src/lang/zh_cn.js
+++ b/web/src/lang/zh_cn.js
@@ -202,5 +202,9 @@ export default {
   edit: {
     newFeatureNoticeTitle: '新特性提醒',
     newFeatureNoticeMessage: '本次更新支持了节点富文本编辑，但是存在一定缺陷，最主要的影响是导出为图片的时间和节点数量成正比，所以对导出需求比较依赖的话可以通过【基础样式】-【其他配置】-【是否开启节点富文本编辑】设置关掉富文本编辑模式。'
+  },
+  mouseAction: {
+    tip1: '当前：左键拖动画布，右键框选节点',
+    tip2: '当前：左键框选节点，右键拖动画布',
   }
 }
diff --git a/web/src/pages/Doc/en/changelog/index.md b/web/src/pages/Doc/en/changelog/index.md
index c797641e..313f8de6 100644
--- a/web/src/pages/Doc/en/changelog/index.md
+++ b/web/src/pages/Doc/en/changelog/index.md
@@ -2,9 +2,9 @@
 
 ## 0.6.0
 
-optimization: Optimize the directory structure of simple-mind-map source code.
+Breaking change: Adjusted the directory structure of the simple-mind-map source code, Main impact: 1. The introduction path of the plugin needs to be modified. The constant file path needs to be modified.
 
-New: 1.Supports one click zoom to fit the canvas function. 2.Press and hold the Ctrl key to activate the multi selection function on demand through configuration.
+New: 1.Supports one click zoom to fit the canvas function. 2.Press and hold the Ctrl key to activate the multi selection function on demand through configuration. 3.Support setting to left click to select multiple nodes and right click to drag the canvas.
 
 Fix: 1.Fix the issue where holding down the Ctrl key to select multiple nodes does not trigger the click event for the node.
 
diff --git a/web/src/pages/Doc/en/changelog/index.vue b/web/src/pages/Doc/en/changelog/index.vue
index 1637209c..00ac383c 100644
--- a/web/src/pages/Doc/en/changelog/index.vue
+++ b/web/src/pages/Doc/en/changelog/index.vue
@@ -2,8 +2,8 @@
   <div>
     <h1>Changelog</h1>
 <h2>0.6.0</h2>
-<p>optimization: Optimize the directory structure of simple-mind-map source code.</p>
-<p>New: 1.Supports one click zoom to fit the canvas function. 2.Press and hold the Ctrl key to activate the multi selection function on demand through configuration.</p>
+<p>Breaking change: Adjusted the directory structure of the simple-mind-map source code, Main impact: 1. The introduction path of the plugin needs to be modified. The constant file path needs to be modified.</p>
+<p>New: 1.Supports one click zoom to fit the canvas function. 2.Press and hold the Ctrl key to activate the multi selection function on demand through configuration. 3.Support setting to left click to select multiple nodes and right click to drag the canvas.</p>
 <p>Fix: 1.Fix the issue where holding down the Ctrl key to select multiple nodes does not trigger the click event for the node.</p>
 <h2>0.5.11</h2>
 <p>New: Supports associative text editing.</p>
diff --git a/web/src/pages/Doc/en/constructor/index.md b/web/src/pages/Doc/en/constructor/index.md
index c90cd00a..26e0559f 100644
--- a/web/src/pages/Doc/en/constructor/index.md
+++ b/web/src/pages/Doc/en/constructor/index.md
@@ -65,6 +65,7 @@ const mindMap = new MindMap({
 | defaultAssociativeLineText（v0.5.11+）     |  String | 关联 | Association Line Default Text  |          |
 | fitPadding（v0.6.0+）     |  Number | 50 |  The padding of mind mapping when adapting to canvas size, Unit: px |          |
 | enableCtrlKeyNodeSelection（v0.6.0+）     | Boolean  | true |  Whether to enable the function of holding down the Ctrl key to select multiple nodes |          |
+| useLeftKeySelectionRightKeyDrag（v0.6.0+）     | Boolean  | false | Setting to left click to select multiple nodes and right click to drag the canvas.  |          |
 
 ### Watermark config
 
diff --git a/web/src/pages/Doc/en/constructor/index.vue b/web/src/pages/Doc/en/constructor/index.vue
index 25e45378..2fb28681 100644
--- a/web/src/pages/Doc/en/constructor/index.vue
+++ b/web/src/pages/Doc/en/constructor/index.vue
@@ -315,6 +315,13 @@
 <td>Whether to enable the function of holding down the Ctrl key to select multiple nodes</td>
 <td></td>
 </tr>
+<tr>
+<td>useLeftKeySelectionRightKeyDrag（v0.6.0+）</td>
+<td>Boolean</td>
+<td>false</td>
+<td>Setting to left click to select multiple nodes and right click to drag the canvas.</td>
+<td></td>
+</tr>
 </tbody>
 </table>
 <h3>Watermark config</h3>
diff --git a/web/src/pages/Doc/zh/changelog/index.md b/web/src/pages/Doc/zh/changelog/index.md
index 83a6aed9..916d6f32 100644
--- a/web/src/pages/Doc/zh/changelog/index.md
+++ b/web/src/pages/Doc/zh/changelog/index.md
@@ -2,9 +2,9 @@
 
 ## 0.6.0
 
-优化：优化simple-mind-map源码目录结构。
+破坏性更新：调整了simple-mind-map源码的目录结构，主要影响：1.插件的引入路径需要修改。2.constant文件路径需要修改。
 
-新增：1.支持一键缩放至适应画布功能。 2.按住Ctrl键多选功能可通过配置按需开启。
+新增：1.支持一键缩放至适应画布功能。 2.按住Ctrl键多选功能可通过配置按需开启。 3.支持设置为左键多选节点，右键拖动画布。
 
 修复：1.修复按住ctrl键多选节点时不会触发节点的click事件的问题。
 
diff --git a/web/src/pages/Doc/zh/changelog/index.vue b/web/src/pages/Doc/zh/changelog/index.vue
index 5b2b8afb..0f9dede3 100644
--- a/web/src/pages/Doc/zh/changelog/index.vue
+++ b/web/src/pages/Doc/zh/changelog/index.vue
@@ -2,8 +2,8 @@
   <div>
     <h1>Changelog</h1>
 <h2>0.6.0</h2>
-<p>优化：优化simple-mind-map源码目录结构。</p>
-<p>新增：1.支持一键缩放至适应画布功能。 2.按住Ctrl键多选功能可通过配置按需开启。</p>
+<p>破坏性更新：调整了simple-mind-map源码的目录结构，主要影响：1.插件的引入路径需要修改。2.constant文件路径需要修改。</p>
+<p>新增：1.支持一键缩放至适应画布功能。 2.按住Ctrl键多选功能可通过配置按需开启。 3.支持设置为左键多选节点，右键拖动画布。</p>
 <p>修复：1.修复按住ctrl键多选节点时不会触发节点的click事件的问题。</p>
 <h2>0.5.11</h2>
 <p>新增：支持关联性文本编辑。</p>
diff --git a/web/src/pages/Doc/zh/constructor/index.md b/web/src/pages/Doc/zh/constructor/index.md
index 76a6985f..41761614 100644
--- a/web/src/pages/Doc/zh/constructor/index.md
+++ b/web/src/pages/Doc/zh/constructor/index.md
@@ -65,6 +65,7 @@ const mindMap = new MindMap({
 | defaultAssociativeLineText（v0.5.11+）     |  String | 关联 |  关联线默认文字 |          |
 | fitPadding（v0.6.0+）     |  Number | 50 |  思维导图适应画布大小时的内边距，单位：px |          |
 | enableCtrlKeyNodeSelection（v0.6.0+）     | Boolean  | true | 是否开启按住ctrl键多选节点的功能  |          |
+| useLeftKeySelectionRightKeyDrag（v0.6.0+）     | Boolean  | false | 设置为左键多选节点，右键拖动画布  |          |
 
 ### 水印配置
 
diff --git a/web/src/pages/Doc/zh/constructor/index.vue b/web/src/pages/Doc/zh/constructor/index.vue
index f2360ce7..e086dcb7 100644
--- a/web/src/pages/Doc/zh/constructor/index.vue
+++ b/web/src/pages/Doc/zh/constructor/index.vue
@@ -315,6 +315,13 @@
 <td>是否开启按住ctrl键多选节点的功能</td>
 <td></td>
 </tr>
+<tr>
+<td>useLeftKeySelectionRightKeyDrag（v0.6.0+）</td>
+<td>Boolean</td>
+<td>false</td>
+<td>设置为左键多选节点，右键拖动画布</td>
+<td></td>
+</tr>
 </tbody>
 </table>
 <h3>水印配置</h3>
diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue
index d5183ac4..4dd7c97f 100644
--- a/web/src/pages/Edit/components/Edit.vue
+++ b/web/src/pages/Edit/components/Edit.vue
@@ -100,6 +100,7 @@ export default {
     ...mapState({
       isZenMode: state => state.localConfig.isZenMode,
       openNodeRichText: state => state.localConfig.openNodeRichText,
+      useLeftKeySelectionRightKeyDrag: state => state.localConfig.useLeftKeySelectionRightKeyDrag,
     })
   },
   watch: {
@@ -289,7 +290,8 @@ export default {
           }
         },
         ...(config || {}),
-        iconList: icon
+        iconList: icon,
+        useLeftKeySelectionRightKeyDrag: this.useLeftKeySelectionRightKeyDrag
       })
       if (this.openNodeRichText) this.addRichTextPlugin()
       this.mindMap.keyCommand.addShortcut('Control+s', () => {
diff --git a/web/src/pages/Edit/components/MouseAction.vue b/web/src/pages/Edit/components/MouseAction.vue
new file mode 100644
index 00000000..f8e1012c
--- /dev/null
+++ b/web/src/pages/Edit/components/MouseAction.vue
@@ -0,0 +1,79 @@
+<template>
+  <div class="mouseActionContainer">
+    <el-tooltip
+      class="item"
+      effect="dark"
+      :content="
+        useLeftKeySelectionRightKeyDrag
+          ? $t('mouseAction.tip2')
+          : $t('mouseAction.tip1')
+      "
+      placement="top"
+    >
+      <div
+        class="btn iconfont"
+        :class="[useLeftKeySelectionRightKeyDrag ? 'iconmouseR' : 'iconmouseL']"
+        @click="toggleAction"
+      ></div>
+    </el-tooltip>
+  </div>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+
+/**
+ * @Author: 王林
+ * @Date: 2021-06-24 22:53:10
+ * @Desc: 鼠标操作设置
+ */
+export default {
+  name: 'MouseAction',
+  props: {
+    mindMap: {
+      type: Object
+    }
+  },
+  data() {
+    return {}
+  },
+  computed: {
+    ...mapState({
+      useLeftKeySelectionRightKeyDrag: state =>
+        state.localConfig.useLeftKeySelectionRightKeyDrag
+    })
+  },
+  methods: {
+    ...mapMutations(['setLocalConfig']),
+
+    toggleAction() {
+      let val = !this.useLeftKeySelectionRightKeyDrag
+      this.mindMap.updateConfig({
+        useLeftKeySelectionRightKeyDrag: val
+      })
+      this.setLocalConfig({
+        useLeftKeySelectionRightKeyDrag: val
+      })
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.mouseActionContainer {
+  display: flex;
+  align-items: center;
+
+  .item {
+    margin-right: 12px;
+
+    &:last-of-type {
+      margin-right: 0;
+    }
+  }
+
+  .btn {
+    cursor: pointer;
+  }
+}
+</style>
diff --git a/web/src/pages/Edit/components/NavigatorToolbar.vue b/web/src/pages/Edit/components/NavigatorToolbar.vue
index 76081fc1..e724b6d4 100644
--- a/web/src/pages/Edit/components/NavigatorToolbar.vue
+++ b/web/src/pages/Edit/components/NavigatorToolbar.vue
@@ -15,6 +15,9 @@
         />
       </el-select>
     </div>
+    <div class="item">
+      <MouseAction :mindMap="mindMap"></MouseAction>
+    </div>
     <div class="item">
       <el-checkbox v-model="openMiniMap" @change="toggleMiniMap">{{
         $t('navigatorToolbar.openMiniMap')
@@ -46,6 +49,7 @@
 <script>
 import Scale from './Scale'
 import Fullscreen from './Fullscreen'
+import MouseAction from './MouseAction.vue'
 import { langList } from '@/config'
 import i18n from '@/i18n'
 import { storeLang, getLang } from '@/api'
@@ -59,7 +63,8 @@ export default {
   name: 'NavigatorToolbar',
   components: {
     Scale,
-    Fullscreen
+    Fullscreen,
+    MouseAction
   },
   props: {
     mindMap: {
diff --git a/web/src/store.js b/web/src/store.js
index 091183b0..4c274937 100644
--- a/web/src/store.js
+++ b/web/src/store.js
@@ -13,7 +13,9 @@ const store = new Vuex.Store({
       // 本地配置
       isZenMode: false, // 是否是禅模式
       // 是否开启节点富文本
-      openNodeRichText: true
+      openNodeRichText: true,
+      // 鼠标行为
+      useLeftKeySelectionRightKeyDrag: false
     },
     activeSidebar: '' // 当前显示的侧边栏
   },