Demo:设置里增加节点内容间距的设置

web/src/lang/en_us.js

@@ -82,7 +82,9 @@ export default {
     changeRichTextTip: 'This operation will clear all historical modification records and modify the mind map data. Do you want to continue?',
     changeRichTextTip2: 'Do you want to switch to rich text mode?',
     changeRichTextTip3: 'Do you want to switch to non rich text mode?',
-    enableDragImport: 'Is it allowed to directly drag and drop files to the page for import'
+    enableDragImport: 'Is it allowed to directly drag and drop files to the page for import',
+    imgTextMargin: 'Node image and text margin',
+    textContentMargin: 'Node contents margin'
   },
   color: {
     moreColor: 'More color'

web/src/lang/zh_cn.js

@@ -80,7 +80,9 @@ export default {
     changeRichTextTip: '该操作会清空所有历史修改记录，并且修改思维导图数据，是否继续？',
     changeRichTextTip2: '是否切换为富文本模式？',
     changeRichTextTip3: '是否切换为非富文本模式？',
-    enableDragImport: '是否允许直接拖拽文件到页面进行导入'
+    enableDragImport: '是否允许直接拖拽文件到页面进行导入',
+    imgTextMargin: '节点图片和文本间隔',
+    textContentMargin: '节点各种内容间隔'
   },
   color: {
     moreColor: '更多颜色'

web/src/lang/zh_tw.js

@@ -81,7 +81,9 @@ export default {
     changeRichTextTip: '該操作會清空所有曆史修改記錄，並且修改思維導圖數據，是否繼續？',
     changeRichTextTip2: '是否切換爲富文本模式？',
     changeRichTextTip3: '是否切換爲非富文本模式？',
-    enableDragImport: '是否允許直接拖拽文件到頁面進行導入'
+    enableDragImport: '是否允許直接拖拽文件到頁面進行導入',
+    imgTextMargin: '節點圖片和文本間隔',
+    textContentMargin: '節點各種內容間隔'
   },
   color: {
     moreColor: '更多顏色'

web/src/pages/Edit/components/Setting.vue

@@ -321,6 +321,36 @@
           </el-select>
         </div>
       </div>
+      <!-- 图片和文本内容的间距 -->
+      <div class="row">
+        <div class="rowItem">
+          <span class="name">{{ $t('setting.imgTextMargin') }}</span>
+          <el-slider
+            style="width: 150px"
+            v-model="config.imgTextMargin"
+            @change="
+              value => {
+                updateOtherConfig('imgTextMargin', value)
+              }
+            "
+          ></el-slider>
+        </div>
+      </div>
+      <!-- 文本各内容的间距 -->
+      <div class="row">
+        <div class="rowItem">
+          <span class="name">{{ $t('setting.textContentMargin') }}</span>
+          <el-slider
+            style="width: 150px"
+            v-model="config.textContentMargin"
+            @change="
+              value => {
+                updateOtherConfig('textContentMargin', value)
+              }
+            "
+          ></el-slider>
+        </div>
+      </div>
     </div>
   </Sidebar>
 </template>
@@ -355,7 +385,9 @@ export default {
         createNewNodeBehavior: 'default',
         openRealtimeRenderOnNodeTextEdit: true,
         alwaysShowExpandBtn: false,
-        enableAutoEnterTextEditWhenKeydown: true
+        enableAutoEnterTextEditWhenKeydown: true,
+        imgTextMargin: 0,
+        textContentMargin: 0
       },
       watermarkConfig: {
         show: false,
@@ -447,7 +479,7 @@ export default {
       storeConfig({
         config: this.data.config
       })
-      if (['alwaysShowExpandBtn'].includes(key)) {
+      if (['alwaysShowExpandBtn', 'imgTextMargin', 'textContentMargin'].includes(key)) {
         this.mindMap.reRender()
       }
     },