fix: 1

src/app/liantong/example/index.vue

@@ -16,6 +16,9 @@
 
     <template v-if="activeEntity">
       <ElButton @click="activeEntity.copy({ count: 5 })"> 向右复制5个 </ElButton>
+      <ElButton @click="activeEntity.split('x')"> 上下拆分 </ElButton>
+      <ElButton @click="activeEntity.split('y')"> 左右拆分 </ElButton>
+      <ElButton @click="activeEntity.setSize({ w: 1, h: 1 })"> 设置大小 </ElButton>
       <ElButton @click="activeEntity.del()"> 删除 </ElButton>
     </template>
 

src/board/packages/poi/edit-poi.ts

@@ -2,6 +2,7 @@ import { Transformer } from "konva/lib/shapes/Transformer";
 import {
   CopyProps,
   copyEntityAttrib,
+  generateId,
   isLineIntersectingPolygon,
 } from "../../shared";
 import { Poi, PoiAttrib } from "./poi";
@@ -10,6 +11,7 @@ import { Rect } from "konva/lib/shapes/Rect";
 import { Transform } from "konva/lib/Util";
 import { MathUtils } from "three";
 import { nextTick } from "vue";
+import { Attrib } from "../../type";
 
 export class EditPoi<T extends PoiAttrib = PoiAttrib> extends Poi<T> {
   initShape() {
@@ -142,6 +144,7 @@ export class EditPoi<T extends PoiAttrib = PoiAttrib> extends Poi<T> {
 
   copy(props: Pick<CopyProps, "count" | "dire"> = {}) {
     let i = 0;
+
     copyEntityAttrib({
       ...props,
       entity: this,
@@ -156,4 +159,84 @@ export class EditPoi<T extends PoiAttrib = PoiAttrib> extends Poi<T> {
     });
     this.container.bus.emit("dataChange");
   }
+
+  setSize(size: { w: number; h: number }) {
+    const rect = (this.shape as Group).findOne<Rect>(".rect");
+    const origin = {
+      width: rect.width(),
+      height: rect.height(),
+    };
+    this.attrib.scaleX = origin.width / size.w;
+    this.attrib.scaleY = origin.height / size.h;
+  }
+
+  split(axis: "x" | "y") {
+    const items = this.container.getSameLevelData(this) as Attrib[];
+    const newAttrib = {
+      ...this.attrib,
+      id: generateId(items),
+    };
+
+    const rect = (this.shape as Group).findOne<Rect>(".rect");
+    const size = {
+      width: rect.width(),
+      height: rect.height(),
+    };
+    console.log(size);
+    if (axis === "y") {
+      console.log(rect.width());
+      const sMat = new Transform()
+        .multiply(this.shape.getTransform())
+        .translate(size.width / 2, 0)
+        .scale(0.5, 1)
+        .translate(-size.width / 2, 0);
+
+      const cMat = new Transform()
+        .multiply(this.shape.getTransform())
+        .translate(-size.width / 2, 0)
+        .scale(0.5, 1)
+        .translate(size.width / 2, 0);
+
+      const sd = sMat.decompose();
+      this.attrib.scaleX = sd.scaleX;
+      this.attrib.scaleY = sd.scaleY;
+      this.attrib.rotate = sd.rotation;
+      this.attrib.x = sd.x;
+      this.attrib.y = sd.y;
+
+      const cd = cMat.decompose();
+      newAttrib.scaleX = cd.scaleX;
+      newAttrib.scaleY = cd.scaleY;
+      newAttrib.rotate = cd.rotation;
+      newAttrib.x = cd.x;
+      newAttrib.y = cd.y;
+    } else {
+      const sMat = new Transform()
+        .multiply(this.shape.getTransform())
+        .translate(0, size.height / 2)
+        .scale(1, 0.5)
+        .translate(0, -size.height / 2);
+
+      const cMat = new Transform()
+        .multiply(this.shape.getTransform())
+        .translate(0, -size.height / 2)
+        .scale(1, 0.5)
+        .translate(0, size.height / 2);
+
+      const sd = sMat.decompose();
+      this.attrib.scaleX = sd.scaleX;
+      this.attrib.scaleY = sd.scaleY;
+      this.attrib.rotate = sd.rotation;
+      this.attrib.x = sd.x;
+      this.attrib.y = sd.y;
+
+      const cd = cMat.decompose();
+      newAttrib.scaleX = cd.scaleX;
+      newAttrib.scaleY = cd.scaleY;
+      newAttrib.rotate = cd.rotation;
+      newAttrib.x = cd.x;
+      newAttrib.y = cd.y;
+    }
+    items.push(newAttrib as any);
+  }
 }