Merge pull request #245 from hepengwei/feat_he

优化代码
hepengwei · Jan 17, 2024 · 08ded36 · 08ded36
2 parents 2fa7f23 + 9389fbf
commit 08ded36
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 7 deletions.
diff --git a/docs/main.js b/docs/main.js
diff --git a/src/pages/echarts/Tree/components/Tree1.tsx b/src/pages/echarts/Tree/components/Tree1.tsx
@@ -1,6 +1,7 @@
 // @ts-nocheck
 import React, { useEffect, useRef } from "react";
 import G6, { IGroup, IShape, ModelConfig } from "@antv/g6";
+import { textAddLineBreak } from "utils/util";
 import styles from "../index.module.scss";
 
 const padding = 6;
@@ -36,10 +37,11 @@ G6.registerNode(
           name: "box-shape",
         });
         // 添加标题(每行20个字符)
-        const text = `【第${cfg.level}层】${cfg.title}`.replace(
-          /(.{20})/g,
-          "$1\n"
-        );
+        const text = textAddLineBreak(`【第${cfg.level}层】${cfg.title}`, 20);
+        // const text = `【第${cfg.level}层】${cfg.title}`.replace(
+        //   /(.{20})/g,
+        //   "$1\n"
+        // );
         const title = group.addShape("text", {
           attrs: {
             text,
@@ -64,7 +66,7 @@ G6.registerNode(
         if (rows <= 1) {
           y += 4;
         } else {
-          y -= Math.ceil((rows - 2) * 3.5);
+          y -= Math.ceil((rows - 2) * 4);
         }
         // 添加编号
         const code = group.addShape("text", {
@@ -88,7 +90,7 @@ G6.registerNode(
           y: -titleBox.height / 2 - padding,
           width: titleBox.width + padding * 2,
           height: Math.ceil(
-            titleBox.height + codeBox.height + padding * 2 + rows * 1.5
+            titleBox.height + codeBox.height + padding * 2 + rows
           ),
         });
         // 非第1层且有字节的要增加展开收起按钮

diff --git a/src/utils/util.ts b/src/utils/util.ts
@@ -72,3 +72,27 @@ export const getFixedWidthText = (
   document.body.removeChild(span);
   return returnText;
 };
+
+/**
+ * 为一个字符串每rowStrLength个字后添加换行符（最后的换行符不要，兼容由多个Unicode码组合成的汉字）
+ * @text   原字符串
+ * @rowStrLength 每多少个字后加换行符
+ */
+export const textAddLineBreak = (text: string, rowStrLength: number) => {
+  let num = 0;
+  let result = "";
+  if (!text || rowStrLength <= 0) return text;
+  for (const char of text) {
+    if (num >= rowStrLength) {
+      result += `${char}\n`;
+      num = 0;
+    } else {
+      result += char;
+      num++;
+    }
+  }
+  if (result.endsWith("\n")) {
+    result = result.substring(0, result.length - 1);
+  }
+  return result;
+};