Feat：主题支持配置各个层级节点的内边距

simple-mind-map/src/core/render/node/MindMapNode.js

@@ -1180,10 +1180,9 @@ class MindMapNode {
 
   //  获取padding值
   getPaddingVale() {
-    let { isActive } = this.getData()
     return {
-      paddingX: this.getStyle('paddingX', true, isActive),
+      paddingX: this.getStyle('paddingX'),
-      paddingY: this.getStyle('paddingY', true, isActive)
+      paddingY: this.getStyle('paddingY')
     }
   }
 

simple-mind-map/src/core/render/node/Style.js

@@ -1,6 +1,5 @@
 import { checkIsNodeStyleDataKey } from '../../../utils/index'
 
-const rootProp = ['paddingX', 'paddingY']
 const backgroundStyleProps = [
   'backgroundColor',
   'backgroundImage',
@@ -62,11 +61,10 @@ class Style {
   //  合并样式
   merge(prop, root) {
     let themeConfig = this.ctx.mindMap.themeConfig
-    // 三级及以下节点
+    let defaultConfig = null
-    let defaultConfig = themeConfig.node
     let useRoot = false
-    if (root || rootProp.includes(prop)) {
+    if (root) {
-      // 直接使用最外层样式
+      // 使用最外层样式
       useRoot = true
       defaultConfig = themeConfig
     } else if (this.ctx.isGeneralization) {
@@ -78,12 +76,21 @@ class Style {
     } else if (this.ctx.layerIndex === 1) {
       // 二级节点
       defaultConfig = themeConfig.second
+    } else {
+      // 三级及以下节点
+      defaultConfig = themeConfig.node
     }
+    let value = ''
     // 优先使用节点本身的样式
-    const value =
+    if (this.getSelfStyle(prop) !== undefined) {
-      this.getSelfStyle(prop) !== undefined
+      value = this.getSelfStyle(prop)
-        ? this.getSelfStyle(prop)
+    } else if (defaultConfig[prop] !== undefined) {
-        : defaultConfig[prop]
+      // 否则使用对应层级的样式
+      value = defaultConfig[prop]
+    } else {
+      // 否则使用最外层样式
+      value = themeConfig[prop]
+    }
     if (!useRoot) {
       this.addToEffectiveStyles({
         [prop]: value
@@ -348,7 +355,8 @@ class Style {
 
   // hover和激活节点
   hoverNode(node) {
-    const hoverRectColor = this.merge('hoverRectColor') || this.ctx.mindMap.opt.hoverRectColor
+    const hoverRectColor =
+      this.merge('hoverRectColor') || this.ctx.mindMap.opt.hoverRectColor
     const hoverRectRadius = this.merge('hoverRectRadius')
     node.radius(hoverRectRadius).fill('none').stroke({
       color: hoverRectColor

simple-mind-map/src/themes/default.js

@@ -90,6 +90,8 @@ export default {
     hoverRectColor: '',
     // 点鼠标hover和激活时显示的矩形边框的圆角大小
     hoverRectRadius: 5
+    // paddingX: 15,
+    // paddingY: 5
   },
   // 二级节点样式
   second: {
@@ -116,6 +118,8 @@ export default {
     lineMarkerDir: 'end',
     hoverRectColor: '',
     hoverRectRadius: 5
+    // paddingX: 15,
+    // paddingY: 5
   },
   // 三级及以下节点样式
   node: {
@@ -142,6 +146,8 @@ export default {
     lineMarkerDir: 'end',
     hoverRectColor: '',
     hoverRectRadius: 5
+    // paddingX: 15,
+    // paddingY: 5
   },
   // 概要节点样式
   generalization: {
@@ -167,6 +173,8 @@ export default {
     endDir: [1, 0],
     hoverRectColor: '',
     hoverRectRadius: 5
+    // paddingX: 15,
+    // paddingY: 5
   }
 }
 
@@ -200,7 +208,8 @@ const nodeSizeIndependenceList = [
   'endColor',
   'startDir',
   'endDir',
-  'hoverRectColor'
+  'hoverRectColor',
+  'hoverRectRadius'
 ]
 export const checkIsNodeSizeIndependenceConfig = config => {
   let keys = Object.keys(config)