From 6ebd5ab1845f98347ca37d5a35d4f1c5064e0697 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=98=BF=E5=AE=9A?= <wending.lwd@alibaba-inc.com>
Date: Sun, 27 Apr 2025 15:01:10 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=94=A8=E7=9F=A9=E5=BD=A2=E6=9D=A5?=
 =?UTF-8?q?=E5=B1=95=E7=A4=BA=E5=AE=8C=E6=95=B4=E7=94=A8=E6=88=B7=E5=90=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/core/render/node/nodeCooperate.js     | 65 ++++++++++++++-----
 1 file changed, 48 insertions(+), 17 deletions(-)

diff --git a/simple-mind-map/src/core/render/node/nodeCooperate.js b/simple-mind-map/src/core/render/node/nodeCooperate.js
index 433c1be3..3a30c6c0 100644
--- a/simple-mind-map/src/core/render/node/nodeCooperate.js
+++ b/simple-mind-map/src/core/render/node/nodeCooperate.js
@@ -1,4 +1,4 @@
-import { Circle, G, Text, Image } from '@svgdotjs/svg.js'
+import { Circle, G, Text, Image, Rect } from '@svgdotjs/svg.js'
 import { generateColorByContent } from '../../../utils/index'
 
 // 协同相关功能
@@ -16,23 +16,54 @@ function createTextAvatar(item) {
   const { avatarSize, fontSize } = this.mindMap.opt.cooperateStyle
   const g = new G()
   const str = item.isMore ? item.name : String(item.name)[0]
-  // 圆
-  const circle = new Circle().size(avatarSize, avatarSize)
-  circle.fill({
-    color: item.color || generateColorByContent(str)
-  })
-  // 文本
-  const text = new Text()
-    .text(str)
-    .fill({
-      color: '#fff'
+  
+  if (item.useRect) {
+    // 计算文本宽度
+    const textWidth = str.length * fontSize * 0.6 // 估算文本宽度
+    const rectWidth = Math.max(avatarSize, textWidth + fontSize) // 确保最小宽度为avatarSize
+    const rectHeight = avatarSize
+    
+    // 创建矩形
+    const rect = new Rect()
+      .size(rectWidth, rectHeight)
+      .radius(rectHeight / 2) // 圆角矩形
+      .fill({
+        color: item.color || generateColorByContent(str)
+      })
+    
+    // 文本
+    const text = new Text()
+      .text(str)
+      .fill({
+        color: '#fff'
+      })
+      .css({
+        'font-size': fontSize + 'px'
+      })
+      .dx(-textWidth / 2)
+      .dy((rectHeight - fontSize) / 2)
+    
+    g.add(rect).add(text)
+  } else {
+    // 原有的圆形显示逻辑
+    const circle = new Circle().size(avatarSize, avatarSize)
+    circle.fill({
+      color: item.color || generateColorByContent(str)
     })
-    .css({
-      'font-size': fontSize + 'px'
-    })
-    .dx(-fontSize / 2)
-    .dy((avatarSize - fontSize) / 2)
-  g.add(circle).add(text)
+    // 文本
+    const text = new Text()
+      .text(str)
+      .fill({
+        color: '#fff'
+      })
+      .css({
+        'font-size': fontSize + 'px'
+      })
+      .dx(-fontSize / 2)
+      .dy((avatarSize - fontSize) / 2)
+    g.add(circle).add(text)
+  }
+  
   return g
 }