From a4dc9210b3a14f633e4e2e32251ef83e0ae4a5ee Mon Sep 17 00:00:00 2001
From: wanglin2 <1013335014@qq.com>
Date: Fri, 18 Aug 2023 14:25:24 +0800
Subject: [PATCH] =?UTF-8?q?Fix=EF=BC=9A=E4=BF=AE=E5=A4=8D=E8=8A=82?=
 =?UTF-8?q?=E7=82=B9=E8=BE=B9=E6=A1=86=E4=BC=9A=E9=87=8D=E5=90=88=E7=9A=84?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 simple-mind-map/src/core/render/node/Node.js  | 15 ++++++++++++---
 simple-mind-map/src/core/render/node/Shape.js |  3 +++
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/simple-mind-map/src/core/render/node/Node.js b/simple-mind-map/src/core/render/node/Node.js
index 322d2cd6..f763b650 100644
--- a/simple-mind-map/src/core/render/node/Node.js
+++ b/simple-mind-map/src/core/render/node/Node.js
@@ -257,9 +257,11 @@ class Node {
       this.shapeInstance.getShapePadding(_width, _height, paddingX, paddingY)
     this.shapePadding.paddingX = shapePaddingX
     this.shapePadding.paddingY = shapePaddingY
+    // 边框宽度，因为边框是以中线向两端发散，所以边框会超出节点
+    const borderWidth = this.getBorderWidth()
     return {
-      width: _width + paddingX * 2 + shapePaddingX * 2,
-      height: _height + paddingY * 2 + margin + shapePaddingY * 2
+      width: _width + paddingX * 2 + shapePaddingX * 2 + borderWidth,
+      height: _height + paddingY * 2 + margin + shapePaddingY * 2 + borderWidth
     }
   }
 
@@ -269,10 +271,12 @@ class Node {
     this.group.clear()
     let { width, height, textContentItemMargin } = this
     let { paddingY } = this.getPaddingVale()
-    paddingY += this.shapePadding.paddingY
+    const halfBorderWidth = this.getBorderWidth() / 2
+    paddingY += this.shapePadding.paddingY + halfBorderWidth
     // 节点形状
     this.shapeNode = this.shapeInstance.createShape()
     this.shapeNode.addClass('smm-node-shape')
+    this.shapeNode.translate(halfBorderWidth, halfBorderWidth)
     this.group.add(this.shapeNode)
     this.updateNodeShape()
     // 渲染一个隐藏的矩形区域，用来触发展开收起按钮的显示
@@ -827,6 +831,11 @@ class Node {
     ) // 父级
   }
 
+  // 获取节点非节点状态的边框大小
+  getBorderWidth() {
+    return this.style.merge('borderWidth', false, false) || 0
+  }
+
   //  获取数据
   getData(key) {
     return key ? this.nodeData.data[key] || '' : this.nodeData.data
diff --git a/simple-mind-map/src/core/render/node/Shape.js b/simple-mind-map/src/core/render/node/Shape.js
index d53d8881..edefc6b2 100644
--- a/simple-mind-map/src/core/render/node/Shape.js
+++ b/simple-mind-map/src/core/render/node/Shape.js
@@ -62,7 +62,10 @@ export default class Shape {
   //  创建形状节点
   createShape() {
     const shape = this.node.getShape()
+    const borderWidth = this.node.getBorderWidth()
     let { width, height } = this.node
+    width -= borderWidth
+    height -= borderWidth
     let node = null
     // 矩形
     if (shape === CONSTANTS.SHAPE.RECTANGLE) {