fix: 1

src/app/4dmap/index.ts

@@ -6,6 +6,7 @@ import {
   inRevise,
   Poi,
   PoiAttrib,
+  round,
 } from "../../board";
 import { PolygonsAttrib } from "./type";
 import { Map } from "ol";
@@ -150,11 +151,14 @@ export const createBoard = (
     const mapView = props.map.getView();
     const projection = mapView.getProjection();
     const mpu = projection.getMetersPerUnit();
-    const metersPerPixel = data[0] * mpu;
-    return {
-      value: metersPerPixel,
-      unit: " m",
-    };
+    return data[0] * mpu;
+  };
+  scaleEntity.getScaleText = (val: number) => {
+    if (val > 1000) {
+      return round(val / 1000, 1) + " km";
+    } else {
+      return Math.floor(val) + " m";
+    }
   };
 
   return {

src/app/4dmap/point.ts

@@ -115,8 +115,10 @@ const pointActShapeFactory = (attrib: PolygonsPointAttrib, tree: PoPoint) => {
     },
     hover: () => {
       label.visible(true);
-      out.fill("#409EFF");
-      select.fill("#409EFF");
+      if (!attrib.rtk) {
+        out.fill("#409EFF");
+        select.fill("#409EFF");
+      }
     },
     setData(data: number[]) {
       let [width, height] = getRealAbsoluteSize(group, [1, 1]);

src/app/liantong/example/index.vue

@@ -1,5 +1,6 @@
 <template>
   <Teleport to="#right-pano">
+    {{ activeEntity?.attrib }}
     <ElButton @click="board.clear()"> 清除 </ElButton>
     <ElButton :disabled="!board.history.state.hasUndo" @click="board.history.undo()">
       撤销
@@ -27,6 +28,7 @@
     <ElButton @click="board.hidenPois()"> 隐藏图例 </ElButton>
     <ElButton @click="board.showPoisId()"> 显示图例Id </ElButton>
     <ElButton @click="board.hidePoisId()"> 隐藏图例Id </ElButton>
+    <ElButton @click="board.blurPoi()" v-if="activeEntity"> 去除聚焦 </ElButton>
   </Teleport>
   <div
     class="board-layout"
@@ -39,8 +41,25 @@
 import { shallowRef, watch } from "vue";
 import { EditWholeLine, createBoard, EditPoi, changeEnv } from "../";
 import storeData from "./storeData.json";
+import floor from "./floorplan_cad.json";
 import { ElButton } from "element-plus";
 
+const rooms = floor.floors.map((item) => {
+  return {
+    id: item.id.toString(),
+    points: item["vertex-xy"].map((p) => ({ ...p, id: p.id.toString() })),
+    lines: item["segment"].map((l) => ({
+      id: l.id.toString(),
+      pointIds: [l.a.toString(), l.b.toString()],
+    })),
+    polygons: item["segment"].map((l) => ({
+      id: l.id.toString(),
+      lineIds: [l.id.toString()],
+    })),
+  };
+});
+console.log(rooms);
+
 changeEnv(true);
 withDefaults(defineProps<{ width?: number; height?: number; pixelRation?: number }>(), {
   width: 320,
@@ -51,14 +70,17 @@ type Board = ReturnType<typeof createBoard>;
 
 const board = createBoard();
 board.bound.setRetainScale(true);
-board.bound.setBound([-9.0754444, -5.6740986, 9.0754444, 5.6740986], [0, 0]);
 
 setTimeout(() => {
+  // board.setData({ rooms: rooms });
   board.setData(storeData);
+  board.bound.autoBound(20);
 }, 500);
 
 const activeEntity = shallowRef<EditPoi>();
-board.bus.on("activePoi", (entity) => (activeEntity.value = entity));
+board.bus.on("activePoi", (entity) => {
+  activeEntity.value = entity;
+});
 
 const drawing = shallowRef<ReturnType<EditWholeLine["createPolygon"]>>();
 const drawHandler = () => {

src/app/liantong/index.ts

@@ -45,16 +45,46 @@ export const createBoard = (
   const pois = () => board.getData().pois as PoiAttrib[];
 
   const bus = mitt<{ activePoi: EditPoi | null }>();
-  board.tree.bus.on("active", (entity) => {
-    if (!entity || entity.name.includes(Poi.namespace)) {
-      bus.emit("activePoi", entity as EditPoi);
+  let activePoi: EditPoi = null;
+  board.tree.bus.on("active", ({ entity, active }) => {
+    if (active) {
+      activePoi = entity as EditPoi;
+      entity.bus.emit("statusChange", { active: true });
+      bus.emit("activePoi", activePoi as EditPoi);
+    } else if (entity === activePoi) {
+      entity.bus.emit("statusChange", { active: false });
+      activePoi = null;
+      bus.emit("activePoi", activePoi as EditPoi);
+    } else {
+      entity.bus.emit("statusChange", { active: false });
     }
+    // if (activePoi === entity) return;
+    // if (!entity || entity.name.includes(Poi.namespace)) {
+    //   console.log(activePoi);
+    //   activePoi && activePoi.bus.emit("statusChange", { active: false });
+    //   if (entity) {
+    //     activePoi = entity as EditPoi;
+    //   } else {
+    //     activePoi = null;
+    //   }
+    //   activePoi && activePoi.bus.emit("statusChange", { active: true });
+    //   bus.emit("activePoi", activePoi as EditPoi);
+    // }
   });
 
   // const prevMat:
   return {
     ...board,
     bus,
+    blurPoi() {
+      if (activePoi) {
+        activePoi.bus.emit("shapeStatusChange", {
+          type: "click",
+          current: "common",
+          before: "active",
+        });
+      }
+    },
     clear() {
       board.setData({
         rooms: [{ id: "0", points: [], polygons: [], lines: [] }],

src/board/packages/container.ts

@@ -27,7 +27,7 @@ export type ContainerProps<
 } & Omit<EntityProps<Attrib & { data: DATA }>, "attrib">;
 
 export type ContainerEvent = EntityEvent & {
-  active: Entity;
+  active: { active: boolean; entity: Entity };
   dataChange: void;
   dataChangeBefore: void;
   viewChange: { mat: Transform; size: number[] };
@@ -210,10 +210,19 @@ export class Container<
     // 提取绕Z轴的旋转，即二维旋转角度
     const rotationZ = euler.z; // 在Three.js中，角度是以弧度表示的
     // 更新Konva Stage的位置和缩放
+    const oldScale = this.stage.scale();
     this.stage.scale({ x: scale.x, y: scale.y });
     this.stage.position({ x: translate.x, y: translate.y });
     this.stage.rotation(MathUtils.radToDeg(rotationZ));
-    this.redraw();
+    if (
+      !(
+        Math.abs(oldScale.x - scale.x) < 0.001 &&
+        Math.abs(oldScale.y - scale.y) < 0.001
+      )
+    ) {
+      this.redraw();
+    }
+    this.shape.batchDraw();
 
     this.constant.updateConstantScale(Math.min(scale.x, scale.y));
     this.bus.emit("viewChange", {

src/board/packages/entity.ts

@@ -108,7 +108,8 @@ export abstract class Entity<
   }
 
   setAttrib(newAttrib: Partial<T>) {
-    if (newAttrib.id !== this.attrib.id) {
+    if ("id" in newAttrib && newAttrib.id !== this.attrib.id) {
+      console.log(newAttrib, this.attrib, newAttrib.id, this.attrib.id);
       console.error("id 确定后无法更改");
     }
 

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

@@ -1,17 +1,16 @@
 import { CopyProps, copyEntityAttrib } from "../../shared";
 import { Poi, PoiAttrib } from "./poi";
 
-let activePoi = null;
 export class EditPoi<T extends PoiAttrib = PoiAttrib> extends Poi<T> {
   mounted(): void {
     super.enableMouseAct(this.actShape);
-    super.enableActive((active) => {
-      if (active) {
-        activePoi = this;
-        this.container.bus.emit("active", this);
-      } else if (activePoi === this) {
-        activePoi = null;
-        this.container.bus.emit("active", null);
+    this.bus.on("shapeStatusChange", (data) => {
+      if (data.type === "click") {
+        if (data.current === "active") {
+          this.container.bus.emit("active", { active: true, entity: this });
+        } else {
+          this.container.bus.emit("active", { active: false, entity: this });
+        }
       }
     });
     super.enableDrag({

src/board/packages/scale/scale.ts

@@ -18,7 +18,7 @@ export type ScaleAttrib = {
 
 export class Scale extends Entity<ScaleAttrib, Group> {
   private mat: Transform;
-  pixelScale = { value: 0, unit: "" };
+  pixelScale: number;
   allowable = 0.001;
   private fontSize = 12;
   private padding = 4;
@@ -40,11 +40,11 @@ export class Scale extends Entity<ScaleAttrib, Group> {
 
   getScaleUnit = (pixelScale: number[]) => {
     const scale = Math.max(...pixelScale);
-    // const value = round(scale, 3);
-    return {
-      value: scale * 10000,
-      unit: "",
-    };
+    return scale * 10000;
+  };
+
+  getScaleText = (value: number) => {
+    return value + "";
   };
 
   initShape() {
@@ -87,15 +87,15 @@ export class Scale extends Entity<ScaleAttrib, Group> {
   }
 
   diffRedraw() {
-    if (!this.mat || !this.pixelScale || isNaN(this.pixelScale.value)) return;
+    if (!this.mat || !this.pixelScale || isNaN(this.pixelScale)) return;
 
     let minDeviation = 1;
     let width;
     let realWidth;
     for (let w = this.attrib.minWidth; w <= this.attrib.maxWidth; w++) {
-      const rw = w * this.pixelScale.value;
+      const rw = w * this.pixelScale;
       const deviation = round(rw, 10) - rw;
-      if (deviation < this.allowable) {
+      if (deviation < this.allowable && rw % 5 < 1) {
         width = w;
         realWidth = rw;
         break;
@@ -105,13 +105,13 @@ export class Scale extends Entity<ScaleAttrib, Group> {
         minDeviation = deviation;
       }
     }
-    if (realWidth < 10) {
-      realWidth = round(realWidth, 2);
-    } else if (realWidth < 100) {
-      realWidth = round(realWidth, 1);
-    } else {
-      realWidth = round(realWidth, 0);
-    }
+    // if (realWidth < 10) {
+    //   realWidth = round(realWidth, 2);
+    // } else if (realWidth < 100) {
+    //   realWidth = round(realWidth, 1);
+    // } else {
+    //   realWidth = round(realWidth, 0);
+    // }
 
     if (width === 0 || realWidth === 0) return;
 
@@ -122,7 +122,7 @@ export class Scale extends Entity<ScaleAttrib, Group> {
     points[4] = points[6] = width;
 
     text.width(width);
-    text.text(realWidth + this.pixelScale.unit);
+    text.text(this.getScaleText(realWidth));
 
     const stage = this.container.stage;
     let x = this.attrib.left;

tsconfig.json

@@ -11,6 +11,7 @@
     /* Bundler mode */
     "moduleResolution": "Node",
     "allowImportingTsExtensions": false,
+    "allowSyntheticDefaultImports": true,
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",