From f918b4fc139655c935bea64cd2736b8df342f79e Mon Sep 17 00:00:00 2001
From: susiwen8 <susiwen8@gmail.com>
Date: Sat, 13 Nov 2021 10:53:42 +0800
Subject: [PATCH] feat: `PointLayer` support multi lines (#837)

---
 packages/layers/src/point/models/text.ts   | 2 +-
 packages/layers/src/utils/symbol-layout.ts | 8 ++++----
 stories/Layers/components/Text.tsx         | 2 +-
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/layers/src/point/models/text.ts b/packages/layers/src/point/models/text.ts
index 03d1506cd7..b35ccc35a7 100644
--- a/packages/layers/src/point/models/text.ts
+++ b/packages/layers/src/point/models/text.ts
@@ -419,7 +419,7 @@ export default class TextModel extends BaseModel {
         // @ts-ignore
         size,
         textAnchor,
-        'center',
+        'left',
         spacing,
         textOffset,
         iconfont,
diff --git a/packages/layers/src/utils/symbol-layout.ts b/packages/layers/src/utils/symbol-layout.ts
index 79a7b05eaa..47cf5886af 100644
--- a/packages/layers/src/utils/symbol-layout.ts
+++ b/packages/layers/src/utils/symbol-layout.ts
@@ -174,7 +174,7 @@ function shapeLines(
     }
 
     x = 0;
-    y += lineHeight;
+    y -= lineHeight + 5;
   });
 
   const { horizontalAlign, verticalAlign } = getAnchorAlignment(textAnchor);
@@ -192,7 +192,7 @@ function shapeLines(
   const height = y - yOffset;
 
   shaping.top += -verticalAlign * height;
-  shaping.bottom = shaping.top + height;
+  shaping.bottom = shaping.top - height;
   shaping.left += -horizontalAlign * maxLineLength;
   shaping.right = shaping.left + maxLineLength;
 }
@@ -249,7 +249,7 @@ function shapeIconFont(
     }
 
     x = 0;
-    y += lineHeight;
+    y -= lineHeight + 5;
   });
 
   const { horizontalAlign, verticalAlign } = getAnchorAlignment(textAnchor);
@@ -267,7 +267,7 @@ function shapeIconFont(
   const height = y - yOffset;
 
   shaping.top += -verticalAlign * height;
-  shaping.bottom = shaping.top + height;
+  shaping.bottom = shaping.top - height;
   shaping.left += -horizontalAlign * maxLineLength;
   shaping.right = shaping.left + maxLineLength;
 }
diff --git a/stories/Layers/components/Text.tsx b/stories/Layers/components/Text.tsx
index b21abf355f..a0629e0698 100644
--- a/stories/Layers/components/Text.tsx
+++ b/stories/Layers/components/Text.tsx
@@ -39,7 +39,7 @@ export default class TextLayerDemo extends React.Component {
           y: 'w',
         },
       })
-      .shape('s', 'text')
+      .shape(['s', 'm'], (...args) => args.map(i => `${i}\n`).join(''))
       // .shape('circle')
       .size(18)
       .filter('t', (t) => {