@aibee/crc-bmap 0.0.129 → 0.0.130

package/lib/bmap.esm.js

@@ -454,7 +454,7 @@ var require_Graph = __commonJS({
 });
 
 // src/bmap.ts
-import { EventDispatcher as EventDispatcher7, Vector3 as Vector318 } from "three";
+import { EventDispatcher as EventDispatcher7, Vector3 as Vector320 } from "three";
 
 // src/utils/timer.ts
 var Timer = class {
@@ -624,8 +624,10 @@ function hasChinese(str) {
 }
 
 // src/utils/texture.ts
-import { DataTexture, RGBAFormat, LinearFilter } from "three";
+import { DataTexture, RGBAFormat, LinearFilter, TextureLoader } from "three";
+var urlTextureMap = /* @__PURE__ */ new Map();
 var textTextureMap = /* @__PURE__ */ new Map();
+var textureLoader = new TextureLoader();
 function initCanvas() {
   const canvas2 = document.createElement("canvas");
   canvas2.width = 1024;
@@ -675,12 +677,38 @@ function getTextureByText(text) {
   return texture;
 }
 function clearTextTexture() {
+  textTextureMap.forEach((v, _) => {
+    v.dispose();
+  });
+  urlTextureMap.forEach((v) => {
+    if (v instanceof Promise) {
+      v.then((r) => r.dispose());
+    } else {
+      v.dispose();
+    }
+  });
   textTextureMap.clear();
+  urlTextureMap.clear();
 }
 function clearCanvas() {
   ctx = null;
   canvas = null;
 }
+async function getTextureByUrl(url) {
+  if (urlTextureMap.has(url)) {
+    return urlTextureMap.get(url);
+  }
+  const texturePromise = textureLoader.loadAsync(url);
+  texturePromise.then((texture) => {
+    texture.format = RGBAFormat;
+    texture.magFilter = LinearFilter;
+    texture.minFilter = LinearFilter;
+    texture.colorSpace = "srgb";
+    urlTextureMap.set(url, texture);
+  });
+  urlTextureMap.set(url, texturePromise);
+  return texturePromise;
+}
 
 // src/utils/coordinate.ts
 import { Vector3, Vector2 as Vector22 } from "three";
@@ -1152,6 +1180,9 @@ function moveOnRoute(startPoint, endPoint, distance) {
   const [startX, startY] = startPoint;
   const [endX, endY] = endPoint;
   const routeLength = Math.sqrt(Math.pow(endX - startX, 2) + Math.pow(endY - startY, 2));
+  if (routeLength === 0 || routeLength < distance) {
+    return [...endPoint];
+  }
   const ratio = distance / routeLength;
   const newX = startX + (endX - startX) * ratio;
   const newY = startY + (endY - startY) * ratio;
@@ -2012,11 +2043,11 @@ function toWebWorker(obj) {
 // src/context.ts
 import {
   EventDispatcher as EventDispatcher6,
-  Box2,
-  Vector3 as Vector317,
-  Vector2 as Vector26,
-  Raycaster as Raycaster3,
-  Box3 as Box39,
+  Box2 as Box23,
+  Vector3 as Vector319,
+  Vector2 as Vector29,
+  Raycaster as Raycaster5,
+  Box3 as Box310,
   Color as Color6,
   AmbientLight as AmbientLight2
 } from "three";
@@ -3007,14 +3038,14 @@ var Poi = class extends EventDispatcher2 {
 };
 
 // src/elements/floor.ts
-import { Box3 as Box35, Object3D as Object3D8, Vector3 as Vector38 } from "three";
+import { Box3 as Box35, Object3D as Object3D8, Vector3 as Vector39 } from "three";
 
 // src/elements/heatmap.ts
 import {
   MeshBasicMaterial as MeshBasicMaterial2,
   Object3D as Object3D5,
   PlaneGeometry as PlaneGeometry2,
-  Texture,
+  Texture as Texture2,
   DoubleSide as DoubleSide2,
   Mesh as Mesh3,
   Matrix3,
@@ -3055,7 +3086,7 @@ var HeatmapElement = class extends Object3D5 {
       this.remove(this.plane);
     }
     const geometry = new PlaneGeometry2(width, height);
-    const texture = new Texture(this.div.firstChild);
+    const texture = new Texture2(this.div.firstChild);
     texture.needsUpdate = true;
     const material = new MeshBasicMaterial2({
       transparent: true,
@@ -3338,6 +3369,160 @@ var PoiLayer = class extends Layer {
   }
 };
 
+// src/layer/poi-layer2.ts
+import { debounce as debounce3 } from "lodash";
+import { Vector2 as Vector25, Vector3 as Vector38 } from "three";
+var PoiLayer2 = class extends Layer {
+  pois = [];
+  debounceCollisionDetection;
+  timer = new Timer();
+  constructor(context) {
+    super(context);
+    this.registryEvent();
+    this.debounceCollisionDetection = debounce3(this.collisionDetection, 10);
+  }
+  clear() {
+    this.pois.forEach((item) => {
+      item.dispose();
+    });
+    this.pois = [];
+    return this;
+  }
+  createPoi(options) {
+    const poi = new Poi2(this.context, options);
+    this.pushPoi(poi);
+    poi.addEventListener(
+      "change-level",
+      () => this.changePoiLevelOrCollisionEnable(poi)
+    );
+    poi.addEventListener(
+      "change-collision_enable",
+      () => this.changePoiLevelOrCollisionEnable(poi)
+    );
+    Promise.resolve().then(() => {
+      this.debounceCollisionDetection();
+    });
+    return poi;
+  }
+  changePoiLevelOrCollisionEnable(poi) {
+    const index = this.pois.findIndex((item) => item === poi);
+    if (index === -1) {
+      return;
+    }
+    this.pois.splice(index, 1);
+    this.pushPoi(poi);
+  }
+  removePoi(poi) {
+    const index = this.pois.findIndex((item) => item === poi);
+    if (index === -1) {
+      return;
+    }
+    this.remove(poi);
+    this.pois.splice(index, 1);
+    poi.dispose();
+  }
+  removePoiById(id) {
+    const poi = this.pois.find((item) => item.options.id === id);
+    if (poi) {
+      this.removePoi(poi);
+    }
+  }
+  getPoiById(id) {
+    const poi = this.pois.find((item) => item.options.id === id);
+    return poi || null;
+  }
+  /**
+   * 保存poi按照level排序
+   * @param poi
+   */
+  pushPoi(poi) {
+    this.add(poi);
+    if (!poi.options.collision_enable) {
+      this.pois.unshift(poi);
+      return;
+    }
+    if (poi.options.level === 0) {
+      this.pois.push(poi);
+      return;
+    }
+    for (let i = 0; i < this.pois.length; i++) {
+      const item = this.pois[i];
+      if (!item.options.collision_enable) {
+        continue;
+      }
+      if (item.options.level <= poi.options.level) {
+        this.pois.splice(i, 0, poi);
+        return;
+      }
+    }
+    this.pois.push(poi);
+  }
+  getPoiByDeviceXy(x, y) {
+    const v2 = new Vector25(x, y);
+    const pois = this.pois.filter((item) => {
+      return item instanceof Poi2 && item.box.containsPoint(v2);
+    });
+    return pois;
+  }
+  onUpdate = () => {
+    this.timer.requestAnimationFrame(() => {
+      this.collisionDetection();
+    });
+  };
+  /**
+   * 碰撞检测
+   */
+  collisionDetection() {
+    const range = [];
+    const { camera } = this.context;
+    camera.updateMatrixWorld();
+    const isValid = (n) => n <= 1 && n >= -1;
+    const m4 = camera.projectionMatrix.clone();
+    m4.multiply(camera.matrixWorldInverse);
+    const pois = this.pois.filter((item) => {
+      if (item.visible) {
+        const vector = new Vector38().setFromMatrixPosition(item.matrixWorld);
+        vector.applyMatrix4(m4);
+        item.screenPosition = vector;
+        return isValid(vector.x) && isValid(vector.y) && isValid(vector.z);
+      }
+      return false;
+    });
+    pois.forEach((item, index) => {
+      const box = item.getBox(
+        item.screenPosition
+      );
+      if (index === 0 || !item.options.collision_enable) {
+        range.push(box);
+        item.parentSetVisible(true);
+        return;
+      }
+      const valid = range.some((rangeBox) => {
+        return rangeBox.intersectsBox(box);
+      });
+      item.parentSetVisible(!valid);
+      if (!valid) {
+        range.push(box);
+      }
+    });
+  }
+  registryEvent() {
+    this.context.addEventListener("update", this.onUpdate);
+  }
+  unRegistryEvent() {
+    this.context.removeEventListener("update", this.onUpdate);
+  }
+  dispose() {
+    this.timer.dispose();
+    this.pois.forEach((item) => item.dispose());
+    this.pois.length = 0;
+    this.debounceCollisionDetection = () => {
+    };
+    super.dispose();
+    this.unRegistryEvent();
+  }
+};
+
 // src/elements/floor.ts
 var Floor = class extends Object3D8 {
   constructor(context) {
@@ -3346,6 +3531,7 @@ var Floor = class extends Object3D8 {
     this.groundLayer = new Layer(this.context);
     this.graphicLayer = new GraphicLayer(this.context);
     this.poiLayer = new PoiLayer(this.context);
+    this.poiLayer2 = new PoiLayer2(this.context);
     this.wallLayer = new Layer(this.context);
     this.textureLayer = new Layer(this.context);
     this.glbModelLayer = new Layer(this.context);
@@ -3353,6 +3539,7 @@ var Floor = class extends Object3D8 {
     this.mergeGraphicLayer = new Layer(this.context);
     this.groundUpper.add(this.graphicLayer);
     this.groundUpper.add(this.poiLayer);
+    this.groundUpper.add(this.poiLayer2);
     this.groundUpper.add(this.wallLayer);
     this.groundUpper.add(this.textureLayer);
     this.groundUpper.add(this.glbModelLayer);
@@ -3364,6 +3551,7 @@ var Floor = class extends Object3D8 {
   }
   graphicLayer;
   poiLayer;
+  poiLayer2;
   wallLayer;
   textureLayer;
   glbModelLayer;
@@ -3379,9 +3567,10 @@ var Floor = class extends Object3D8 {
   groundMaxHeight = 0;
   name = "";
   key = "";
+  box = new Box35();
   getPosition() {
     const box = new Box35().setFromObject(this);
-    return box.getCenter(new Vector38());
+    return box.getCenter(new Vector39());
   }
   createGround(options) {
     const ground = new Graphic(this.context, options);
@@ -3406,7 +3595,7 @@ var Floor = class extends Object3D8 {
     return !!(this.grounds.size || this.graphicLayer.children.length);
   }
   getCenter() {
-    return new Box35().setFromObject(this).getCenter(new Vector38());
+    return new Box35().setFromObject(this).getCenter(new Vector39());
   }
   addModel(options) {
     const model = new Model(this.context, options);
@@ -3416,8 +3605,8 @@ var Floor = class extends Object3D8 {
   }
   addShadow() {
     const box = new Box35().setFromObject(this.groundUpper);
-    const center2 = box.getCenter(new Vector38());
-    const size = box.getSize(new Vector38());
+    const center2 = box.getCenter(new Vector39());
+    const size = box.getSize(new Vector39());
     this.shadow.setPosition(center2);
     this.shadow.changeLightCamera(size);
   }
@@ -3450,11 +3639,15 @@ var Floor = class extends Object3D8 {
   setShadowVisible(visible) {
     this.shadow.visible = visible;
   }
+  updateBox() {
+    this.box.setFromObject(this);
+  }
   dispose() {
     this.shadow.dispose();
     this.groundLayer.dispose();
     this.graphicLayer.dispose();
     this.poiLayer.dispose();
+    this.poiLayer2.dispose();
     this.wallLayer.dispose();
     this.textureLayer.dispose();
     this.glbModelLayer.dispose();
@@ -3471,7 +3664,7 @@ var Floor = class extends Object3D8 {
 };
 
 // src/elements/base-svg.ts
-import { EventDispatcher as EventDispatcher3, Vector3 as Vector39 } from "three";
+import { EventDispatcher as EventDispatcher3, Vector3 as Vector310 } from "three";
 var BaseSvg = class extends EventDispatcher3 {
   constructor(context) {
     super();
@@ -3509,7 +3702,7 @@ var BaseSvg = class extends EventDispatcher3 {
     const { clientWidth, clientHeight } = renderer.domElement;
     const nx = x / clientWidth * 2 - 1;
     const ny = 1 - y / clientHeight * 2;
-    const v = new Vector39(nx, ny, 0);
+    const v = new Vector310(nx, ny, 0);
     return v.unproject(camera);
   }
   getSvgCoordinate(vector) {
@@ -3868,7 +4061,7 @@ import {
   Mesh as Mesh4,
   Object3D as Object3D9,
   ShaderMaterial as ShaderMaterial2,
-  Vector3 as Vector310
+  Vector3 as Vector311
 } from "three";
 import { mergeGeometries } from "three/examples/jsm/utils/BufferGeometryUtils";
 var Wall = class extends Object3D9 {
@@ -3978,8 +4171,8 @@ var Wall = class extends Object3D9 {
       for (let i = 0; i < curCds.length; i++) {
         const cur = curCds[i];
         const next = i + 1 === curCds.length ? curCds[0] : curCds[i + 1];
-        points.push(new Vector310(cur[0], cur[1], _height));
-        points.push(new Vector310(next[0], next[1], _height));
+        points.push(new Vector311(cur[0], cur[1], _height));
+        points.push(new Vector311(next[0], next[1], _height));
       }
     }
     return points;
@@ -4084,7 +4277,7 @@ var GroundTexture = class extends Object3D10 {
 };
 
 // src/elements/glb-model.ts
-import { Box3 as Box37, Object3D as Object3D11, Vector3 as Vector311 } from "three";
+import { Box3 as Box37, Object3D as Object3D11, Vector3 as Vector312 } from "three";
 var defaultGlbOptions = {
   url: "",
   geometry: { type: "polygon", cds: [], coords: [], curveCpt: [], curveIndex: [] },
@@ -4109,7 +4302,7 @@ var GlbModel = class extends Object3D11 {
     const object = await loadModel(this.options.url);
     object.scene.rotation.set(Math.PI / 2, 0, 0);
     const box = new Box37().setFromObject(object.scene);
-    const size = box.getSize(new Vector311());
+    const size = box.getSize(new Vector312());
     const max = Math.max(size.x, size.y);
     const scale = this.options.width / max;
     this.scale.set(scale, scale, scale);
@@ -4126,7 +4319,7 @@ var GlbModel = class extends Object3D11 {
 };
 
 // src/elements/lane.ts
-import { BufferGeometry as BufferGeometry3, LineSegments as LineSegments3, Mesh as Mesh6, Object3D as Object3D12, ShapeGeometry as ShapeGeometry2, Vector3 as Vector312 } from "three";
+import { BufferGeometry as BufferGeometry3, LineSegments as LineSegments3, Mesh as Mesh6, Object3D as Object3D12, ShapeGeometry as ShapeGeometry2, Vector3 as Vector313 } from "three";
 import { mergeGeometries as mergeGeometries3 } from "three/examples/jsm/utils/BufferGeometryUtils";
 import { Line2 } from "three/examples/jsm/lines/Line2";
 import { LineGeometry } from "three/examples/jsm/lines/LineGeometry";
@@ -4187,8 +4380,8 @@ var Lane = class extends Object3D12 {
       for (let i = 0; i < curCds.length; i++) {
         const cur = curCds[i];
         const next = i + 1 === curCds.length ? curCds[0] : curCds[i + 1];
-        points.push(new Vector312(cur[0], cur[1], _height));
-        points.push(new Vector312(next[0], next[1], _height));
+        points.push(new Vector313(cur[0], cur[1], _height));
+        points.push(new Vector313(next[0], next[1], _height));
       }
     }
     return points;
@@ -4263,7 +4456,7 @@ import {
   Object3D as Object3D13,
   ExtrudeGeometry as ExtrudeGeometry3,
   Mesh as Mesh7,
-  Vector3 as Vector313,
+  Vector3 as Vector314,
   BufferGeometry as BufferGeometry4,
   LineSegments as LineSegments4,
   ShaderMaterial as ShaderMaterial3,
@@ -4391,8 +4584,8 @@ var MergeGraphic = class extends Object3D13 {
         for (let i = 0; i < curCds.length; i++) {
           const cur = curCds[i];
           const next = i + 1 === curCds.length ? curCds[0] : curCds[i + 1];
-          points.push(new Vector313(cur[0], cur[1], height));
-          points.push(new Vector313(next[0], next[1], height));
+          points.push(new Vector314(cur[0], cur[1], height));
+          points.push(new Vector314(next[0], next[1], height));
         }
       }
     });
@@ -4424,13 +4617,241 @@ var MergeGraphic = class extends Object3D13 {
   }
 };
 
+// src/elements/poi2.ts
+import {
+  Box2 as Box22,
+  Object3D as Object3D14,
+  Sprite,
+  SpriteMaterial,
+  Vector2 as Vector26
+} from "three";
+var defaultOptions4 = {
+  text: "",
+  icon: "",
+  icon_size: [18, 18],
+  level: 1,
+  collision_enable: true,
+  opacity: 1,
+  id: "",
+  position: { x: 0, y: 0, z: 0 },
+  text_font_size: 14
+};
+var Poi2 = class extends Object3D14 {
+  constructor(context, options) {
+    super();
+    this.context = context;
+    this.options = proxyOptions(
+      { ...defaultOptions4, ...options },
+      this
+    );
+    this.position.set(
+      this.options.position.x,
+      this.options.position.y,
+      this.options.position.z
+    );
+    this.registryEvent();
+    this.init();
+  }
+  options;
+  textAspect = 1;
+  spriteText;
+  spriteIcon;
+  box = new Box22();
+  boxHelper;
+  get durIconAndText() {
+    return this.options.icon && this.options.text ? 2 : 0;
+  }
+  get offset() {
+    return this.options.icon && this.options.text ? 0 : 0.5;
+  }
+  get iconWidth() {
+    return this.options.icon ? this.options.icon_size[0] : 0;
+  }
+  get iconHeight() {
+    return this.options.icon ? this.options.icon_size[1] : 0;
+  }
+  get textWidth() {
+    return this.options.text ? this.options.text_font_size * this.textAspect : 0;
+  }
+  get textHeight() {
+    return this.options.text ? this.options.text_font_size : 0;
+  }
+  get deltaZ() {
+    const { offset, iconHeight, durIconAndText, textHeight } = this;
+    let dz = offset * (iconHeight + durIconAndText + textHeight) / this.context.camera.zoom;
+    dz += 0.1;
+    return dz;
+  }
+  registryEvent() {
+    this.context.addEventListener("control-zoom-change", this._initScale);
+    this.addEventListener("change-icon", async ({ value }) => {
+      if (this.spriteIcon) {
+        this.remove(this.spriteIcon);
+        this.spriteIcon = void 0;
+      }
+      await this.initIcon();
+      this.initSize();
+      this._initScale({ zoom: this.context.camera.zoom });
+    });
+    this.addEventListener("change-text", ({ value }) => {
+      if (this.spriteText) {
+        this.remove(this.spriteText);
+        this.spriteText = void 0;
+      }
+      this.initText();
+      this.initSize();
+      this._initScale({ zoom: this.context.camera.zoom });
+    });
+  }
+  unRegistryEvent() {
+    this.context.removeEventListener("control-zoom-change", this._initScale);
+  }
+  async initIcon() {
+    if (this.options.icon) {
+      const texture = await getTextureByUrl(this.options.icon);
+      const spriteIcon = new Sprite(
+        new SpriteMaterial({
+          map: texture,
+          transparent: true,
+          alphaTest: 0.2
+        })
+      );
+      spriteIcon.renderOrder = 1e5;
+      texture.needsUpdate = true;
+      this.add(spriteIcon);
+      this.spriteIcon = spriteIcon;
+    }
+  }
+  initText() {
+    if (this.options.text) {
+      const texture = getTextureByText(this.options.text);
+      this.textAspect = texture.image.width / texture.image.height;
+      const spriteText = new Sprite(
+        new SpriteMaterial({
+          map: texture,
+          transparent: true,
+          alphaTest: 0.2
+        })
+      );
+      spriteText.renderOrder = 100001;
+      texture.needsUpdate = true;
+      this.spriteText = spriteText;
+      this.add(spriteText);
+    }
+  }
+  initSize() {
+    let iconCenterY = 0;
+    let textCenterY = 0;
+    const { icon, text } = this.options;
+    if (icon) {
+      if (text) {
+        iconCenterY = 0;
+        textCenterY = iconCenterY * (this.iconHeight / this.textHeight) - this.iconHeight / this.textHeight - this.durIconAndText / this.textHeight;
+      } else {
+        iconCenterY = 0.5;
+        textCenterY = 0;
+      }
+    } else if (text) {
+      textCenterY = 0.5;
+      iconCenterY = 0;
+    } else {
+      iconCenterY = 0;
+      textCenterY = 0;
+    }
+    this.spriteIcon?.center.set(0.5, iconCenterY);
+    this.spriteText?.center.set(0.5, textCenterY);
+  }
+  async init() {
+    await this.initIcon();
+    this.initText();
+    this.initSize();
+    this._initScale({ zoom: this.context.camera.zoom });
+  }
+  _initScale = ({ zoom }) => {
+    if (this.spriteText) {
+      const scaleText = this.textHeight / zoom;
+      this.spriteText.scale.set(this.textAspect * scaleText, scaleText, 0.1);
+    }
+    if (this.spriteIcon) {
+      this.spriteIcon?.scale.set(
+        this.options.icon_size[0] / zoom,
+        this.options.icon_size[1] / zoom,
+        0.1
+      );
+    }
+    this.resetZ();
+  };
+  resetZ() {
+    const dz = this.deltaZ;
+    if (this.spriteIcon) {
+      this.spriteIcon.position.z = dz;
+    }
+    if (this.spriteText) {
+      this.spriteText.position.z = dz;
+    }
+  }
+  getBox(v3) {
+    const {
+      clientSize: { width, height }
+    } = this.context;
+    const x = width * (v3.x + 1) / 2;
+    let y = height * (-v3.y + 1) / 2;
+    y += this.offset * (this.iconHeight + this.durIconAndText + this.textHeight);
+    const halfIconWidth = this.iconWidth / 2;
+    const boundIcon = new Box22(
+      new Vector26(x - halfIconWidth, y - this.iconHeight),
+      new Vector26(x + halfIconWidth, y)
+    );
+    const halfTextWidth = this.textWidth / 2;
+    const boundText = new Box22(
+      new Vector26(x - halfTextWidth, y - this.textHeight - this.durIconAndText - this.iconHeight),
+      new Vector26(
+        x + halfTextWidth,
+        y - this.iconHeight - this.durIconAndText
+      )
+    );
+    this.box = boundText.union(boundIcon);
+    return this.box;
+  }
+  renderBoxHelper() {
+    if (!this.boxHelper) {
+      const div = document.createElement("div");
+      div.style.position = "fixed";
+      this.boxHelper = div;
+      div.style.border = "1px solid red";
+      div.style.pointerEvents = "none";
+      this.context.container.appendChild(div);
+    }
+    this.boxHelper.style.left = this.box.min.x + "px";
+    this.boxHelper.style.top = this.box.min.y + "px";
+    this.boxHelper.style.width = this.box.max.x - this.box.min.x + "px";
+    this.boxHelper.style.height = this.box.max.y - this.box.min.y + "px";
+  }
+  // 碰撞检测设置显隐
+  parentSetVisible(visible) {
+    if (this.spriteText) {
+      this.spriteText.visible = visible;
+    }
+    if (this.spriteIcon) {
+      this.spriteIcon.visible = visible;
+    }
+    if (this.boxHelper) {
+      this.boxHelper.style.display = visible ? "block" : "none";
+    }
+  }
+  dispose() {
+    this.unRegistryEvent();
+    this.spriteText = void 0;
+  }
+};
+
 // src/operations/selection/box-selection.ts
-import { Frustum } from "three";
+import { Frustum as Frustum2 } from "three";
 var BoxSelection = class extends BaseSvg {
   startPoint;
   endPoint;
   rect;
-  frustum = new Frustum();
+  frustum = new Frustum2();
   constructor(context) {
     super(context);
     const { config: { selectBox: { fill, stroke } } } = context;
@@ -4681,7 +5102,7 @@ var Selection = class extends EventDispatcher4 {
 };
 
 // src/operations/hover/hover-helper.ts
-import { EventDispatcher as EventDispatcher5 } from "three";
+import { EventDispatcher as EventDispatcher5, Vector2 as Vector27 } from "three";
 var HoverHelper = class extends EventDispatcher5 {
   constructor(context) {
     super();
@@ -4705,11 +5126,20 @@ var HoverHelper = class extends EventDispatcher5 {
       let distance = 1e4;
       poiGraphics.forEach((graphic) => {
         const poi = pois.find((poi2) => poi2.options.id === graphic.options.id);
-        const { x, y } = poi.clientPos;
-        let curDistance = Math.sqrt((x - e.offsetX) ** 2 + (y - e.offsetY) ** 2);
-        if (curDistance < distance) {
-          distance = curDistance;
-          resGraphic = graphic;
+        if (poi instanceof Poi) {
+          const { x, y } = poi.clientPos;
+          let curDistance = Math.sqrt((x - e.offsetX) ** 2 + (y - e.offsetY) ** 2);
+          if (curDistance < distance) {
+            distance = curDistance;
+            resGraphic = graphic;
+          }
+        } else if (poi instanceof Poi2) {
+          const { x, y } = poi.box.getCenter(new Vector27());
+          let curDistance = Math.sqrt((x - e.offsetX) ** 2 + (y - e.offsetY) ** 2);
+          if (curDistance < distance) {
+            distance = curDistance;
+            resGraphic = graphic;
+          }
         }
       });
       allGraphics.add(resGraphic);
@@ -4790,7 +5220,7 @@ import {
   MeshBasicMaterial as MeshBasicMaterial5,
   ShaderMaterial as ShaderMaterial4,
   DoubleSide as DoubleSide4,
-  Vector2 as Vector25
+  Vector2 as Vector28
 } from "three";
 function vectorToString(vector) {
   return `${vector.x}-${vector.y}-${vector.z}`;
@@ -4966,7 +5396,7 @@ var MaterialFactory = class {
       dashSize: 1,
       gapSize: 3,
       dashScale: 1,
-      resolution: new Vector25(this.context.clientSize.width, this.context.clientSize.height)
+      resolution: new Vector28(this.context.clientSize.width, this.context.clientSize.height)
     });
     this.line2MaterialMap.set(key, material);
     return material;
@@ -5001,7 +5431,7 @@ var MaterialFactory = class {
 };
 
 // src/utils/camera-bound.ts
-import { Box3 as Box38, Vector3 as Vector316 } from "three";
+import { Box3 as Box39, Vector3 as Vector318 } from "three";
 var CameraBound = class {
   constructor(context) {
     this.context = context;
@@ -5009,11 +5439,15 @@ var CameraBound = class {
     this.changePrevCamera();
   }
   prevCamera = {
-    position: new Vector316(),
+    position: new Vector318(),
     zoom: 1,
-    target: new Vector316()
+    target: new Vector318()
   };
   enable = true;
+  box = new Box39();
+  updateBox() {
+    this.box.setFromObject(this.context.scene);
+  }
   setEnable(enable) {
     this.enable = enable;
     if (enable) {
@@ -5048,13 +5482,13 @@ var CameraBound = class {
     if (!floors.length) {
       return null;
     }
-    const box = new Box38().setFromObject(this.context.scene);
+    const box = this.box;
     const { camera, clientSize: { width: w, height: h } } = this.context;
     const { min, max } = box;
     const lb = vector3ToDevice(min, camera, w, h);
     const rt = vector3ToDevice(max, camera, w, h);
-    const lt = vector3ToDevice(new Vector316(min.x, max.y, max.z), camera, w, h);
-    const rb = vector3ToDevice(new Vector316(max.x, min.y, min.z), camera, w, h);
+    const lt = vector3ToDevice(new Vector318(min.x, max.y, max.z), camera, w, h);
+    const rb = vector3ToDevice(new Vector318(max.x, min.y, min.z), camera, w, h);
     const left = Math.min(lb.x, rt.x, lt.x, rb.x);
     const right = Math.max(lb.x, rt.x, lt.x, rb.x);
     const top = Math.min(lb.y, rt.y, lt.y, rb.y);
@@ -5093,13 +5527,13 @@ var CameraBound = class {
 };
 
 // src/factory/texture.ts
-import { TextureLoader } from "three";
+import { TextureLoader as TextureLoader2 } from "three";
 var TextureFactory = class {
   constructor(context) {
     this.context = context;
   }
   textureMap = /* @__PURE__ */ new Map();
-  loader = new TextureLoader();
+  loader = new TextureLoader2();
   async getTexture(url) {
     if (this.textureMap.has(url)) {
       return this.textureMap.get(url);
@@ -5162,6 +5596,7 @@ var Context = class extends EventDispatcher6 {
     y: 0
   };
   renderRf = 0;
+  prevCameraZoom = 1;
   resizeClientSize() {
     const { x, y, width, height } = this.container.getBoundingClientRect();
     this.clientSize = {
@@ -5174,6 +5609,7 @@ var Context = class extends EventDispatcher6 {
   init() {
     const { clientWidth: w, clientHeight: h } = this.container;
     this.camera = initCamera(w, h);
+    this.prevCameraZoom = this.camera.zoom;
     this.renderer.setSize(w, h);
     this.control = initControl(this.camera, this.renderer.domElement);
     this.control.maxPolarAngle = this.config.control.maxPolar;
@@ -5185,13 +5621,17 @@ var Context = class extends EventDispatcher6 {
       this.currentFloor?.setShadowOpacity(polarAngle / this.config.control.maxPolar);
       this.dispatchEvent({ type: "change-ratio", px: (this.basicRatio || 0) * this.camera.zoom });
       this.dispatchEvent({ type: "control-change" });
+      if (this.prevCameraZoom !== this.camera.zoom) {
+        this.dispatchEvent({ type: "control-zoom-change", zoom: this.camera.zoom });
+        this.prevCameraZoom = this.camera.zoom;
+      }
     });
     this.cameraBound = new CameraBound(this);
   }
   /**
    * 获取两个点之间的像素数
    */
-  getRatio(point1 = new Vector317(0, 0, 0), point22 = new Vector317(100, 0, 0)) {
+  getRatio(point1 = new Vector319(0, 0, 0), point22 = new Vector319(100, 0, 0)) {
     const { clientWidth, clientHeight } = this.container;
     const device1 = vector3ToDevice(point1, this.camera, clientWidth, clientHeight);
     const device2 = vector3ToDevice(point22, this.camera, clientWidth, clientHeight);
@@ -5216,6 +5656,7 @@ var Context = class extends EventDispatcher6 {
       this.lights.position.x = position.x;
       this.lights.position.y = position.y;
     }
+    this.cameraBound.updateBox();
   }
   onWindowResize = () => {
     const { container, camera, renderer } = this;
@@ -5252,10 +5693,10 @@ var Context = class extends EventDispatcher6 {
    * @returns
    */
   getGraphicsByDeviceXy(x, y) {
-    const point3 = new Vector26();
+    const point3 = new Vector29();
     point3.x = x / this.clientSize.width * 2 - 1;
     point3.y = y / this.clientSize.height * -2 + 1;
-    const raycaster = new Raycaster3();
+    const raycaster = new Raycaster5();
     raycaster.setFromCamera(point3, this.camera);
     raycaster.ray.origin.sub(raycaster.ray.direction.clone().multiplyScalar(100));
     const res = this.currentFloor?.graphicLayer.getGraphicByRaycaster(raycaster);
@@ -5269,7 +5710,8 @@ var Context = class extends EventDispatcher6 {
    */
   getPoisByDeviceXy(x, y) {
     const pois = this.currentFloor?.poiLayer.getPoiByDeviceXy(x, y);
-    return pois || [];
+    const res = this.currentFloor?.poiLayer2.getPoiByDeviceXy(x, y);
+    return (pois || []).concat(res || []);
   }
   onPointerover = (e) => {
     const { graphics, position } = this.getGraphicsByDeviceXy(e.offsetX, e.offsetY);
@@ -5392,7 +5834,7 @@ var Context = class extends EventDispatcher6 {
     );
   }
   getCameraLookAt() {
-    return new Vector317().subVectors(this.control.target, this.camera.position);
+    return new Vector319().subVectors(this.control.target, this.camera.position);
   }
   /**
    * 按照一个中心点设置相机的放大缩小
@@ -5444,28 +5886,28 @@ var Context = class extends EventDispatcher6 {
     if (force2DView) {
       this.setPolarAngle(0, 0);
     }
-    const boundingBox = new Box39().setFromObject(object);
+    const boundingBox = new Box310().setFromObject(object);
     this.setPolarAngle(polar, 0);
     const { max, min } = boundingBox;
-    const leftTop = new Vector317(min.x, max.y, max.z);
-    const rightTop = new Vector317(max.x, max.y, max.z);
-    const rightBottom = new Vector317(max.x, min.y, min.z);
-    const leftBottom = new Vector317(min.x, min.y, min.z);
+    const leftTop = new Vector319(min.x, max.y, max.z);
+    const rightTop = new Vector319(max.x, max.y, max.z);
+    const rightBottom = new Vector319(max.x, min.y, min.z);
+    const leftBottom = new Vector319(min.x, min.y, min.z);
     const leftTop2d = vector3ToDevice(leftTop, this.camera, width, height);
     const rightTop2d = vector3ToDevice(rightTop, this.camera, width, height);
     const leftBottom2d = vector3ToDevice(leftBottom, this.camera, width, height);
     const rightBottom2d = vector3ToDevice(rightBottom, this.camera, width, height);
-    const boundingBox2d = new Box2().setFromPoints([
-      new Vector26(leftTop2d.x, leftTop2d.y),
-      new Vector26(rightTop2d.x, rightTop2d.y),
-      new Vector26(leftBottom2d.x, leftBottom2d.y),
-      new Vector26(rightBottom2d.x, rightBottom2d.y)
+    const boundingBox2d = new Box23().setFromPoints([
+      new Vector29(leftTop2d.x, leftTop2d.y),
+      new Vector29(rightTop2d.x, rightTop2d.y),
+      new Vector29(leftBottom2d.x, leftBottom2d.y),
+      new Vector29(rightBottom2d.x, rightBottom2d.y)
     ]);
-    const size = boundingBox2d.getSize(new Vector26());
+    const size = boundingBox2d.getSize(new Vector29());
     const xScale = (width - right - left) / size.x;
     const yScale = (height - top - bottom) / size.y;
     const scale = Math.min(xScale, yScale);
-    const center2 = new Vector317((max.x + min.x) / 2, (max.y + min.y) / 2, (max.z + min.z) / 2);
+    const center2 = new Vector319((max.x + min.x) / 2, (max.y + min.y) / 2, (max.z + min.z) / 2);
     return { zoom: scale * this.camera.zoom, center: center2 };
   }
   /**
@@ -5497,10 +5939,17 @@ var Context = class extends EventDispatcher6 {
    * @param duration 动画持续时间
    */
   setCameraPosition(position, duration) {
+    const start = this.camera.position.clone();
+    const lookAtVector = this.getCameraLookAt();
+    if (!duration) {
+      this.control.enabled = false;
+      this.camera.position.copy(position.clone().sub(lookAtVector));
+      this.control.target.copy(position.clone());
+      this.control.update();
+      this.control.enabled = true;
+    }
     return timeoutPromise(
       new Promise((resolve) => {
-        const start = this.camera.position.clone();
-        const lookAtVector = this.getCameraLookAt();
         const tween = new Tween(start, this.tweenGroup).to(position, duration).onUpdate(() => {
           this.camera.position.copy(start.clone().sub(lookAtVector));
           this.control.target.copy(start.clone());
@@ -5627,7 +6076,7 @@ function getConfig(config) {
 }
 
 // src/bmap.ts
-import { debounce as debounce3 } from "lodash";
+import { debounce as debounce4 } from "lodash";
 
 // src/api/floor.ts
 async function loadBuildingGround({ brand, project }, config) {
@@ -5877,6 +6326,7 @@ var BMap = class extends EventDispatcher7 {
       if (createdFloor) {
         createdFloor.curFloor.name = floor;
         this.triggerHooks("switch_floor_before" /* SWITCH_FLOOR_BEFORE */, createdFloor);
+        createdFloor.curFloor.updateBox();
         this.context.switchFloor(createdFloor.curFloor);
         this.initialFloorCamera();
         this.triggerHooks("switch_floor_after" /* SWITCH_FLOOR_AFTER */, createdFloor);
@@ -6016,7 +6466,7 @@ var BMap = class extends EventDispatcher7 {
         } = this.context;
         const device = vector3ToDevice(position, camera, width, height);
         const offsetX = device.x - width / 2;
-        const v3 = new Vector318();
+        const v3 = new Vector320();
         v3.setFromMatrixColumn(this.context.camera.matrix, 0);
         v3.normalize();
         v3.multiplyScalar(offsetX / this.context.camera.zoom);
@@ -6121,7 +6571,7 @@ var BMap = class extends EventDispatcher7 {
     window.addEventListener("keydown", this.onKeydown);
     window.addEventListener("keyup", this.onKeyUp);
     if (this.config.resizeObserver) {
-      const observe = new ResizeObserver(debounce3(this.resize, 5));
+      const observe = new ResizeObserver(debounce4(this.resize, 5));
       observe.observe(this.container);
       this.observe = observe;
     }
@@ -6241,15 +6691,16 @@ var BMap = class extends EventDispatcher7 {
     return this.context.currentFloor?.graphicLayer.createGraphic(options);
   }
   removePoiById(id) {
-    return this.context.currentFloor?.poiLayer.removePoiById(id);
+    this.context.currentFloor?.poiLayer.removePoiById(id);
+    this.context.currentFloor?.poiLayer2.removePoiById(id);
   }
   getPoiById(id) {
-    return this.context.currentFloor?.poiLayer.getPoiById(id);
+    return this.context.currentFloor?.poiLayer.getPoiById(id) || this.context.currentFloor?.poiLayer2.getPoiById(id);
   }
   getPois() {
-    return (this.context.currentFloor?.poiLayer.pois || []).filter(
+    return [...(this.context.currentFloor?.poiLayer.pois || []).filter(
       (item) => !item.options.built_in
-    );
+    ), ...this.context.currentFloor?.poiLayer2.pois || []];
   }
   clearPoi() {
     if (this.context.currentFloor) {
@@ -6390,11 +6841,11 @@ function Worker2() {
 // src/plugins/navigation/path.ts
 import {
   Mesh as Mesh8,
-  Object3D as Object3D16,
-  TextureLoader as TextureLoader2,
+  Object3D as Object3D17,
+  TextureLoader as TextureLoader3,
   Color as Color8,
-  Vector2 as Vector28,
-  Vector3 as Vector320,
+  Vector2 as Vector211,
+  Vector3 as Vector322,
   NormalBlending,
   RepeatWrapping
 } from "three";
@@ -6402,8 +6853,8 @@ import {
 // src/external/meshLine.js
 import {
   BufferGeometry as BufferGeometry5,
-  Matrix4,
-  Vector3 as Vector319,
+  Matrix4 as Matrix42,
+  Vector3 as Vector321,
   Ray as Ray2,
   Sphere,
   LineSegments as LineSegments5,
@@ -6412,7 +6863,7 @@ import {
   ShaderMaterial as ShaderMaterial5,
   UniformsLib,
   Color as Color7,
-  Vector2 as Vector27
+  Vector2 as Vector210
 } from "three";
 var MeshLine = class extends BufferGeometry5 {
   constructor() {
@@ -6430,7 +6881,7 @@ var MeshLine = class extends BufferGeometry5 {
     this._points = [];
     this._geom = null;
     this.widthCallback = null;
-    this.matrixWorld = new Matrix4();
+    this.matrixWorld = new Matrix42();
     Object.defineProperties(this, {
       // this is now a bufferGeometry
       // add getter to support previous api
@@ -6483,7 +6934,7 @@ MeshLine.prototype.setPoints = function(points, wcb) {
   this.widthCallback = wcb;
   this.positions = [];
   this.counters = [];
-  if (points.length && points[0] instanceof Vector319) {
+  if (points.length && points[0] instanceof Vector321) {
     for (var j = 0; j < points.length; j++) {
       var p = points[j];
       var c = j / points.length;
@@ -6504,10 +6955,10 @@ MeshLine.prototype.setPoints = function(points, wcb) {
   this.process();
 };
 function MeshLineRaycast(raycaster, intersects) {
-  var inverseMatrix = new Matrix4();
+  var inverseMatrix = new Matrix42();
   var ray = new Ray2();
   var sphere = new Sphere();
-  var interRay = new Vector319();
+  var interRay = new Vector321();
   var geometry = this.geometry;
   if (!geometry.boundingSphere) geometry.computeBoundingSphere();
   sphere.copy(geometry.boundingSphere);
@@ -6517,9 +6968,9 @@ function MeshLineRaycast(raycaster, intersects) {
   }
   inverseMatrix.copy(this.matrixWorld).invert();
   ray.copy(raycaster.ray).applyMatrix4(inverseMatrix);
-  var vStart = new Vector319();
-  var vEnd = new Vector319();
-  var interSegment = new Vector319();
+  var vStart = new Vector321();
+  var vEnd = new Vector321();
+  var interSegment = new Vector321();
   var step = this instanceof LineSegments5 ? 2 : 1;
   var index = geometry.index;
   var attributes = geometry.attributes;
@@ -6573,8 +7024,8 @@ MeshLine.prototype.getDistance = function(i) {
   let maxLength = 0;
   for (let k = 0; k < i; k++) {
     const index = 6 * k;
-    const p0 = new Vector319(this.positions[index], this.positions[index + 1], this.positions[index + 2]);
-    const p1 = new Vector319(this.positions[index + 6], this.positions[index + 7], this.positions[index + 8]);
+    const p0 = new Vector321(this.positions[index], this.positions[index + 1], this.positions[index + 2]);
+    const p1 = new Vector321(this.positions[index + 6], this.positions[index + 7], this.positions[index + 8]);
     const distance = p0.distanceTo(p1);
     maxLength += distance;
   }
@@ -6809,6 +7260,7 @@ ShaderChunk["meshline_frag"] = [
   "uniform float visibility;",
   "uniform float alphaTest;",
   "uniform vec2 repeat;",
+  "uniform float thresholdRatio;",
   "",
   "varying vec2 vUV;",
   "varying vec4 vColor;",
@@ -6829,6 +7281,9 @@ ShaderChunk["meshline_frag"] = [
   "    gl_FragColor.a *= step(vCounters, visibility);",
   "",
   ShaderChunk.fog_fragment,
+  "if (vUV.x <= thresholdRatio) {",
+  "gl_FragColor = vec4(0.0, 0.0, 0.0, 0.0);",
+  "}",
   "}"
 ].join("\n");
 var MeshLineMaterial = class extends ShaderMaterial5 {
@@ -6842,7 +7297,7 @@ var MeshLineMaterial = class extends ShaderMaterial5 {
         useAlphaMap: { value: 0 },
         color: { value: new Color7(16777215) },
         opacity: { value: 1 },
-        resolution: { value: new Vector27(1, 1) },
+        resolution: { value: new Vector210(1, 1) },
         sizeAttenuation: { value: 1 },
         dashArray: { value: 0 },
         dashOffset: { value: 0 },
@@ -6850,7 +7305,12 @@ var MeshLineMaterial = class extends ShaderMaterial5 {
         useDash: { value: 0 },
         visibility: { value: 1 },
         alphaTest: { value: 0 },
-        repeat: { value: new Vector27(1, 1) }
+        repeat: { value: new Vector210(1, 1) },
+        thresholdRatio: { value: 0 },
+        transparent: { value: true },
+        depthTest: { vale: false },
+        depthWrite: { value: false },
+        alphaTest: { value: 0.2 }
       }),
       vertexShader: ShaderChunk.meshline_vert,
       fragmentShader: ShaderChunk.meshline_frag
@@ -7002,6 +7462,15 @@ var MeshLineMaterial = class extends ShaderMaterial5 {
         set: function(value) {
           this.uniforms.repeat.value.copy(value);
         }
+      },
+      thresholdRatio: {
+        enumerable: true,
+        get: function() {
+          return this.uniforms.thresholdRatio.value;
+        },
+        set: function(value) {
+          this.uniforms.thresholdRatio.value = value;
+        }
       }
     });
     this.setValues(parameters);
@@ -7037,12 +7506,13 @@ var defaultConfig2 = {
   lineWidth: 8,
   color: 16777215
 };
-var Path2 = class extends Object3D16 {
+var Path2 = class extends Object3D17 {
   constructor(navigation, config) {
     super();
     this.navigation = navigation;
     this.config = Object.assign({}, defaultConfig2, config);
     this.registryEvent();
+    this.prevCameraZoom = this.navigation.bmap.context.camera.zoom;
   }
   mesh = null;
   geometry = null;
@@ -7050,7 +7520,9 @@ var Path2 = class extends Object3D16 {
   texture = null;
   config = defaultConfig2;
   points = [];
+  pathDistance = 0;
   basicRepeat = 1;
+  prevCameraZoom = 0;
   registryEvent() {
     this.navigation.bmap.context.addEventListener(
       "control-change",
@@ -7066,7 +7538,11 @@ var Path2 = class extends Object3D16 {
     this.navigation.bmap.context.removeEventListener("update", this.onUpdate);
   }
   onControlChange = () => {
-    this.changeRepeat();
+    const zoom = this.navigation.bmap.context.camera.zoom;
+    if (zoom !== this.prevCameraZoom) {
+      this.prevCameraZoom = zoom;
+      this.changeRepeat();
+    }
   };
   onUpdate = () => {
     if (!this.texture) {
@@ -7086,7 +7562,7 @@ var Path2 = class extends Object3D16 {
       }
     } = this;
     const screenPoints = points.map(
-      ([x, y]) => vector3ToDevice(new Vector320(x, y, 0), camera, width, height)
+      ([x, y]) => vector3ToDevice(new Vector322(x, y, 0), camera, width, height)
     ).map(({ x, y }) => [x, y]);
     const pointLength = getPathLength(screenPoints);
     return pointLength / 32;
@@ -7096,11 +7572,11 @@ var Path2 = class extends Object3D16 {
       return;
     }
     const repeat = this.getRepeat();
-    this.material.repeat = new Vector28(repeat, 1);
+    this.material.repeat = new Vector211(repeat, 1);
   }
   loadTexture(url) {
     return new Promise((r, j) => {
-      new TextureLoader2().load(url, r, void 0, j);
+      new TextureLoader3().load(url, r, void 0, j);
     });
   }
   transformPoints(points) {
@@ -7112,12 +7588,20 @@ var Path2 = class extends Object3D16 {
   }
   updatePoints(points) {
     this.points = points;
+    this.pathDistance = getPathLength(points);
     this.changeRepeat();
     const _points = this.transformPoints(points);
     if (this.geometry) {
       this.geometry.setPoints(_points);
     }
   }
+  movePath(distance) {
+    if (!this.material || !this.pathDistance) {
+      return;
+    }
+    const ratio = distance / this.pathDistance;
+    this.material.thresholdRatio = ratio;
+  }
   async create(points) {
     const lineGeometry = this.geometry = new MeshLine();
     this.updatePoints(points);
@@ -7131,7 +7615,7 @@ var Path2 = class extends Object3D16 {
       useMap: true,
       color: new Color8(this.config.color),
       transparent: true,
-      resolution: new Vector28(
+      resolution: new Vector211(
         this.navigation.bmap.context.clientSize.width,
         this.navigation.bmap.context.clientSize.height
       ),
@@ -7140,9 +7624,10 @@ var Path2 = class extends Object3D16 {
       lineWidth: this.config.lineWidth * 2,
       map: this.texture,
       blending: NormalBlending,
-      repeat: new Vector28(this.getRepeat(), 1)
+      repeat: new Vector211(this.getRepeat(), 1)
     });
     const mesh = this.mesh = new Mesh8(lineGeometry, material);
+    mesh.renderOrder = 9;
     this.add(mesh);
     return mesh;
   }
@@ -7157,6 +7642,7 @@ var Path2 = class extends Object3D16 {
 
 // src/plugins/navigation/navigation.ts
 import { Group as TweenGroup2, Tween as Tween2 } from "@tweenjs/tween.js";
+import { Vector3 as Vector323 } from "three";
 var defaultConfig3 = {
   path: {},
   speed: 10,
@@ -7175,6 +7661,8 @@ var Navigation = class extends Plugin {
   options;
   pathTween = new TweenGroup2();
   startPoi = null;
+  movedDistance = 0;
+  pathStart = [0, 0];
   // 处理路线动画
   animationPathOptions = {
     cPathIndex: 0
@@ -7239,6 +7727,10 @@ var Navigation = class extends Plugin {
       this.pathTween.getAll().forEach((item) => item.stop());
       this.pathTween.removeAll();
     }
+    if (this.startPoi) {
+      this.bmap.context.currentFloor?.poiLayer2.removePoi(this.startPoi);
+      this.startPoi = null;
+    }
   }
   onSwitchFloor = ({ data: { curFloor } }) => {
     if (this.paths.length) {
@@ -7318,6 +7810,8 @@ var Navigation = class extends Plugin {
     this.animationPathOptions = {
       cPathIndex: 0
     };
+    this.movedDistance = 0;
+    this.pathStart = cPath[0];
     if (this.path) {
       this.path.updatePoints(cPath);
     } else {
@@ -7327,15 +7821,17 @@ var Navigation = class extends Plugin {
       this.bmap.context.scene.add(this.path);
     }
     if (this.startPoi) {
-      this.startPoi.dispose();
+      this.bmap.context.currentFloor?.poiLayer2.removePoi(this.startPoi);
       this.startPoi = null;
     }
     if (this.options.needStartPoi) {
-      this.startPoi = this.bmap.context.currentFloor?.addPoi({
+      this.startPoi = new Poi2(this.bmap.context, {
         ...this.options.startPoi,
+        id: "navigation_start_poi",
         position: { x: cPath[0][0], y: cPath[0][1], z: 1e-4 },
         collision_enable: false
       }) || null;
+      this.bmap.context.currentFloor?.poiLayer2.pushPoi(this.startPoi);
     }
   }
   catmullRomCurve3(points) {
@@ -7344,7 +7840,7 @@ var Navigation = class extends Plugin {
   /**
    * 按照指定速度移动到目标位置
    * @param point 目标位置
-   * @param speed 移动速度
+   * @param speed 移动速度 / 米/s
    */
   async animationTo(point3, speed = this.options.speed) {
     if (point3.floor !== this.bmap.context.currentFloor?.name || !this.path) {
@@ -7354,7 +7850,7 @@ var Navigation = class extends Plugin {
       animationPathOptions: { cPathIndex }
     } = this;
     const currentPath = [
-      this.path.points[0],
+      this.pathStart,
       ...this.cPath.slice(cPathIndex + 1)
     ];
     const translatedPos = this.translatePoints([point3.pos])[0];
@@ -7400,40 +7896,169 @@ var Navigation = class extends Plugin {
       moveDistanceArray.push(getLength(currentPath[index], pos));
       moveDistance = moveDistanceArray.reduce((sum, cur) => sum + cur, 0);
     }
-    const speedSecond = this.kmPerHourToMetersPerSecond(speed);
-    const timeSecond = moveDistance / speedSecond;
+    const timeSecond = moveDistance / speed;
     this.pathTween.getAll().forEach((item) => item.stop());
     this.pathTween.removeAll();
     const start = { distance: 0 };
+    const prevCPathIndex = this.animationPathOptions.cPathIndex;
+    let pastRouteLength = 0;
+    let pastRouteIndex = 0;
     return new Promise((resolve) => {
-      const tween = new Tween2(start, this.pathTween).to({ distance: moveDistance }, timeSecond * 1e3).onUpdate(() => {
-        for (let i = 0; i < moveDistanceArray.length; i++) {
-          const sumDistance = moveDistanceArray.slice(0, i + 1).reduce((sum, cur) => sum + cur, 0);
-          if (sumDistance >= start.distance) {
-            const prevDistance = sumDistance - moveDistanceArray[i];
-            const needDistance = start.distance - prevDistance;
-            const startPoint = currentPath[i];
-            const nextPoint = currentPath[i + 1];
-            const pos2 = moveOnRoute(startPoint, nextPoint, needDistance);
-            this.path?.updatePoints([pos2, ...currentPath.slice(i + 1)]);
-            this.animationPathOptions.cPathIndex += i;
-            if (this.startPoi) {
-              this.startPoi.position.setX(pos2[0]).setY(pos2[1]);
-            }
-            this.dispatchEvent({ type: "path-animation" });
-            return;
-          }
+      const tween = new Tween2(start, this.pathTween).to({ distance: moveDistance }, timeSecond * 1e3).onUpdate(async () => {
+        let dis = start.distance - pastRouteLength;
+        while (moveDistanceArray.length && dis > moveDistanceArray[0]) {
+          pastRouteLength += moveDistanceArray.shift();
+          pastRouteIndex++;
+          dis = start.distance - pastRouteLength;
         }
+        const startPoint = currentPath[pastRouteIndex];
+        const nextPoint = currentPath[pastRouteIndex + 1];
+        if (!nextPoint) {
+          return;
+        }
+        const pos2 = moveOnRoute(startPoint, nextPoint, dis);
+        this.pathStart = pos2;
+        this.path?.movePath(this.movedDistance + start.distance);
+        this.animationPathOptions.cPathIndex = prevCPathIndex + pastRouteIndex;
+        if (this.startPoi) {
+          this.startPoi.position.setX(pos2[0]).setY(pos2[1]);
+          const target = new Vector323(pos2[0], pos2[1], 0);
+          const offset = new Vector323();
+          offset.setFromMatrixColumn(this.bmap.context.camera.matrix, 1);
+          offset.normalize();
+          offset.multiplyScalar(150 / this.bmap.context.camera.zoom);
+          target.add(offset);
+          this.bmap.context.setCameraPosition(target, 0);
+        }
+        tween.pause();
+        await this.changeCameraToPathUp(200);
+        tween.resume();
+        this.dispatchEvent({ type: "path-animation", pathIndex: this.animationPathOptions.cPathIndex });
       }).onComplete(() => {
         this.pathTween.remove(tween);
         this.dispatchEvent({ type: "path-animation-end" });
+        this.movedDistance += moveDistance;
         resolve(true);
       }).start();
     });
   }
-  kmPerHourToMetersPerSecond(speedInKmPerHour) {
-    const speedInMetersPerSecond = speedInKmPerHour * 1e3 / 3600;
-    return speedInMetersPerSecond;
+  // 计算路线的方向
+  getPathDirection() {
+    const path = this.cPath.slice(this.animationPathOptions.cPathIndex);
+    if (path.length < 3) {
+      return null;
+    }
+    const p0 = path[0];
+    const p1 = path[1];
+    const p2 = path[2];
+    const angle = calc_angle(p0, p1, p2);
+    if (Math.abs(angle) >= 179 && Math.abs(angle) <= 180) {
+      const v1 = new Vector323(p2[0] - p1[0], p2[1] - p1[1], 0).normalize();
+      const v2 = new Vector323(0, 1, 0).normalize();
+      const angle2 = v1.angleTo(v2);
+      const cross = new Vector323().crossVectors(v2, v1);
+      const sign = Object.is(cross.y, 0) ? -1 : 1;
+      const finalAngle = sign * angle2;
+      return finalAngle;
+    } else {
+      return null;
+    }
+  }
+  // 把相机旋转到路线的上方向
+  async changeCameraToPathUp(duration = 100) {
+    let angle = this.getPathDirection();
+    if (angle === null) {
+      return;
+    }
+    const currentAngle = this.bmap.context.control.getAzimuthalAngle();
+    if (Math.abs(currentAngle - angle) > Math.PI) {
+      if (currentAngle > 0) {
+        angle = Math.PI * 2 + angle;
+      } else {
+        angle = angle - Math.PI * 2;
+      }
+    }
+    const diffAngle = Math.abs(angle - this.bmap.context.control.getAzimuthalAngle());
+    if (diffAngle < 0.01) {
+      return;
+    }
+    const { control } = this.bmap.context;
+    return new Promise((resolve) => {
+      const start = { azimuthal: control.getAzimuthalAngle() };
+      const end = { azimuthal: angle };
+      const tween = new Tween2(start, this.pathTween).to(end, duration).onUpdate(() => {
+        control.target.copy(this.startPoi.position);
+        control.maxAzimuthAngle = start.azimuthal;
+        control.minAzimuthAngle = start.azimuthal;
+        control.update();
+        const target = this.startPoi.position.clone();
+        const offset = new Vector323();
+        offset.setFromMatrixColumn(this.bmap.context.camera.matrix, 1);
+        offset.normalize();
+        offset.multiplyScalar(150 / this.bmap.context.camera.zoom);
+        target.add(offset);
+        this.bmap.context.setCameraPosition(target, 0);
+      }).onComplete(() => {
+        control.enabled = true;
+        this.pathTween.remove(tween);
+        resolve(true);
+      }).onStart(() => {
+        control.enabled = false;
+      }).start();
+    });
+  }
+  async initNavigationCamera() {
+    await this.translateCameraToStartPoi(300);
+    await this.changeCameraToPathUp(300);
+  }
+  async translateCameraToStartPoi(duration = 100) {
+    if (!this.startPoi) {
+      return;
+    }
+    const {
+      clientSize: { width, height },
+      camera,
+      control
+    } = this.bmap.context;
+    const halfWidth = Math.round(width / 2);
+    const halfHeight = Math.round(height / 2);
+    const target = control.target.clone();
+    const device = vector3ToDevice(this.startPoi.position, camera, width, height);
+    const offsetX = device.x - halfWidth;
+    const offsetY = halfHeight - device.y + 150;
+    console.log(device, offsetX, offsetY, this.startPoi.position, halfWidth, halfHeight);
+    if (Math.abs(offsetX) < 1 && Math.abs(offsetY) < 1) {
+      return;
+    }
+    if (Math.abs(offsetX) >= 1) {
+      const xv3 = new Vector323();
+      xv3.setFromMatrixColumn(camera.matrix, 0);
+      xv3.normalize();
+      xv3.multiplyScalar(offsetX / camera.zoom);
+      target.add(new Vector323(xv3.x, 0, 0));
+    }
+    if (Math.abs(offsetY) >= 1) {
+      const v3 = new Vector323();
+      v3.setFromMatrixColumn(camera.matrix, 1);
+      v3.normalize();
+      v3.multiplyScalar(offsetY / camera.zoom);
+      target.add(new Vector323(0, v3.y, 0));
+    }
+    return this.bmap.context.setCameraPosition(target, duration);
+  }
+  async initCameraZoom(duration = 100) {
+    if (!this.startPoi) {
+      return;
+    }
+    const { clientSize: { width, height }, currentFloor } = this.bmap.context;
+    const { max, min } = currentFloor.box;
+    const baseScale = Math.min(width / (max.x - min.x), height / (max.y - min.y));
+    const zoom = baseScale * (max.x - min.x) / 20;
+    return this.bmap.context.setZoom(
+      zoom,
+      this.startPoi.position,
+      duration
+    );
   }
   dispose() {
     this.worker.terminate();
@@ -7570,6 +8195,7 @@ var MulFloors = class extends Plugin {
     this.group.add(this.poiLayer, ...floors);
     scene.add(this.group);
     this.floors = floors;
+    this.bmap.context.cameraBound.updateBox();
   }
   hide() {
     const { scene } = this.bmap.context;
@@ -7768,7 +8394,10 @@ var AibeeLoader = class {
     try {
       const cacheVersion = await this.getCacheData(VersionStoreName, cacheKey);
       if (cacheVersion === floorInfo.version_id) {
-        const res = await this.getCacheData(MapDataStoreName, cacheKey);
+        const res = await this.getCacheData(
+          MapDataStoreName,
+          cacheKey
+        );
         if (res) {
           return this.getDataByJson(res);
         }
@@ -7782,6 +8411,7 @@ var AibeeLoader = class {
     const cacheKey = this.getFloorCacheKey(floorInfo);
     console.time(`zstd_json`);
     const res1 = await fetch(floorInfo.map_url).then((res) => res.json());
+    res1.floor = floorInfo.floor;
     console.timeEnd(`zstd_json`);
     this.setCacheData(MapDataStoreName, cacheKey, res1);
     this.setCacheData(VersionStoreName, cacheKey, floorInfo.version_id);
@@ -7789,25 +8419,33 @@ var AibeeLoader = class {
   }
   // 获取路网数据
   async getRoadNetworkData() {
-    const res = await Promise.all(this.floors.map(async (item) => {
-      const cacheKey = this.getFloorCacheKey(item);
-      try {
-        const cacheVersion = await this.getCacheData(VersionStoreName, cacheKey);
-        if (cacheVersion === item.version_id) {
-          const res2 = await this.getCacheData(RoadNetworkDataStoreName, cacheKey);
-          if (res2) {
-            return res2;
+    const res = await Promise.all(
+      this.floors.map(async (item) => {
+        const cacheKey = this.getFloorCacheKey(item);
+        try {
+          const cacheVersion = await this.getCacheData(
+            VersionStoreName,
+            cacheKey
+          );
+          if (cacheVersion === item.version_id) {
+            const res2 = await this.getCacheData(
+              RoadNetworkDataStoreName,
+              cacheKey
+            );
+            if (res2) {
+              return res2;
+            }
           }
+          const route = await fetch(item.route_url).then((res2) => res2.json());
+          this.setCacheData(RoadNetworkDataStoreName, cacheKey, route);
+          return route;
+        } catch {
+          const route = await fetch(item.route_url).then((res2) => res2.json());
+          this.setCacheData(RoadNetworkDataStoreName, cacheKey, route);
+          return route;
         }
-        const route = await fetch(item.route_url).then((res2) => res2.json());
-        await this.setCacheData(RoadNetworkDataStoreName, cacheKey, route);
-        return route;
-      } catch {
-        const route = await fetch(item.route_url).then((res2) => res2.json());
-        await this.setCacheData(RoadNetworkDataStoreName, cacheKey, route);
-        return route;
-      }
-    }));
+      })
+    );
     return res.filter((item) => item.points);
   }
   // 空闲时间请求其他数据
@@ -7815,7 +8453,9 @@ var AibeeLoader = class {
   }
   // 获取多楼层数据
   async getMulFloorsData(floors) {
-    return Promise.all(floors.map((floor) => this.getFloorData(floor))).then((data) => data.filter((item) => item));
+    return Promise.all(floors.map((floor) => this.getFloorData(floor))).then(
+      (data) => data.filter((item) => item)
+    );
   }
   async getDataByUrl(url) {
     const data = await fetch(url).then((res) => res.json());
@@ -7848,38 +8488,61 @@ var AibeeLoader = class {
           });
           floor.userData.graphics = graphics;
           floor.userData.graphicMap = graphicMap;
-          const group = canMergeGraphics.reduce((obj, options) => {
-            const { fillColor, fillOpacity, strokeColor, strokeOpacity, height } = options;
-            const key = `${fillColor}-${fillOpacity}-${strokeColor}-${strokeOpacity}-${height}`;
-            if (obj[key]) {
-              obj[key].push(options);
-            } else {
-              obj[key] = [options];
-            }
-            return obj;
-          }, {});
+          const group = canMergeGraphics.reduce(
+            (obj, options) => {
+              const {
+                fillColor,
+                fillOpacity,
+                strokeColor,
+                strokeOpacity,
+                height
+              } = options;
+              const key = `${fillColor}-${fillOpacity}-${strokeColor}-${strokeOpacity}-${height}`;
+              if (obj[key]) {
+                obj[key].push(options);
+              } else {
+                obj[key] = [options];
+              }
+              return obj;
+            },
+            {}
+          );
           Object.values(group).forEach((options) => {
-            const mergeGeometries5 = new MergeGraphic(this.bmap.context, options);
+            const mergeGeometries5 = new MergeGraphic(
+              this.bmap.context,
+              options
+            );
             floor.mergeGraphicLayer.add(mergeGeometries5);
           });
           break;
         case "ground":
           transformGraphicData(layer.elements, center2);
-          const grounds = layer.elements.map((options) => new Graphic(this.bmap.context, options));
+          const grounds = layer.elements.map(
+            (options) => new Graphic(this.bmap.context, options)
+          );
           floor.addGrounds(grounds);
           break;
         case "wall":
           transformGraphicData(layer.elements, center2);
-          const wallGroup = layer.elements.reduce((obj, options) => {
-            const { fillColor, fillOpacity, strokeColor, strokeOpacity, height } = options;
-            const key = `${fillColor}-${fillOpacity}-${strokeColor}-${strokeOpacity}-${height}`;
-            if (obj[key]) {
-              obj[key].push(options);
-            } else {
-              obj[key] = [options];
-            }
-            return obj;
-          }, {});
+          const wallGroup = layer.elements.reduce(
+            (obj, options) => {
+              const {
+                fillColor,
+                fillOpacity,
+                strokeColor,
+                strokeOpacity,
+                height
+              } = options;
+              const key = `${fillColor}-${fillOpacity}-${strokeColor}-${strokeOpacity}-${height}`;
+              if (obj[key]) {
+                obj[key].push(options);
+              } else {
+                obj[key] = [options];
+              }
+              return obj;
+            },
+            {}
+          );
           Object.values(wallGroup).forEach((optionArray) => {
             const wall = new Wall(this.bmap.context, optionArray);
             floor.wallLayer.add(wall);
@@ -7887,16 +8550,19 @@ var AibeeLoader = class {
           break;
         case "lane":
           transformGraphicData(layer.elements, center2);
-          const laneGroup = layer.elements.reduce((obj, options) => {
-            const { fillColor, fillOpacity, strokeColor, strokeOpacity } = options;
-            const key = `${fillColor}-${fillOpacity}-${strokeColor}-${strokeOpacity}`;
-            if (obj[key]) {
-              obj[key].push(options);
-            } else {
-              obj[key] = [options];
-            }
-            return obj;
-          }, {});
+          const laneGroup = layer.elements.reduce(
+            (obj, options) => {
+              const { fillColor, fillOpacity, strokeColor, strokeOpacity } = options;
+              const key = `${fillColor}-${fillOpacity}-${strokeColor}-${strokeOpacity}`;
+              if (obj[key]) {
+                obj[key].push(options);
+              } else {
+                obj[key] = [options];
+              }
+              return obj;
+            },
+            {}
+          );
           Object.values(laneGroup).forEach((optionArray) => {
             const lane = new Lane(this.bmap.context, optionArray);
             floor.laneLayer.add(lane);
@@ -7911,7 +8577,10 @@ var AibeeLoader = class {
         case "glb":
           transformGraphicData(layer.elements, center2);
           layer.elements.forEach((options) => {
-            const pos = translatePosToCenter([options.center_x, options.center_y], center2);
+            const pos = translatePosToCenter(
+              [options.center_x, options.center_y],
+              center2
+            );
             const model = new GlbModel(this.bmap.context, {
               ...options,
               url: options.secondUrl,
@@ -7926,17 +8595,21 @@ var AibeeLoader = class {
         case "store":
           transformGraphicData(layer.elements, center2);
           layer.elements.map((options) => {
-            const pos = translatePosToCenter([options.center_x, options.center_y], center2);
+            const pos = translatePosToCenter(
+              [options.center_x, options.center_y],
+              center2
+            );
             const graphic = floor.addGraphic(options);
             floor.userData.graphics.push(graphic);
             floor.userData.graphicMap.set(options.id, graphic);
-            const poi = floor.poiLayer.createPoi({
+            const poi = new Poi2(this.bmap.context, {
               id: options.id,
               icon: options.poi_info.icon,
-              texts: [{ text: options.poi_info.showName || options.store_name || options.poi_info.text }],
-              position: { x: pos[0], y: pos[1], z: options.airHeight },
+              text: options.poi_info.showName || options.store_name || options.poi_info.text,
+              position: { x: pos[0], y: pos[1], z: options.airHeight + options.height },
               icon_size: [18, 18]
             });
+            floor.poiLayer2.pushPoi(poi);
             if (poi) {
               poi.userData.type = "store";
               poi.userData.data = options;
@@ -7946,22 +8619,24 @@ var AibeeLoader = class {
         case "facility":
           transformGraphicData(layer.elements, center2);
           layer.elements.map((options) => {
-            const pos = translatePosToCenter(options.geometry.cds, center2);
+            const pos = translatePosToCenter(
+              options.geometry.cds,
+              center2
+            );
             const graphic = floor.addGraphic(options);
             floor.userData.graphics.push(graphic);
             floor.userData.graphicMap.set(options.id, graphic);
             if (options.poi_info) {
-              const poi = floor.poiLayer.createPoi({
+              const poi = new Poi2(this.bmap.context, {
                 id: options.id,
                 icon: options.poi_info.icon,
-                texts: [{ text: options.poi_info.showName || options.store_name || options.poi_info.text }],
-                position: { x: pos[0], y: pos[1], z: options.airHeight },
+                text: options.poi_info.showName || options.store_name || options.poi_info.text,
+                position: { x: pos[0], y: pos[1], z: options.airHeight + options.height },
                 icon_size: [18, 18]
               });
-              if (poi) {
-                poi.userData.type = "facility";
-                poi.userData.data = options;
-              }
+              floor.poiLayer2.pushPoi(poi);
+              poi.userData.type = "facility";
+              poi.userData.data = options;
             }
           });
           break;
@@ -7973,17 +8648,25 @@ var AibeeLoader = class {
             const graphic = floor.addGraphic(options);
             parkingSpacesGraphics.push(graphic);
             parkingSpacesGraphicMap.set(options.id, graphic);
-            const pos = translatePosToCenter([options.center_x, options.center_y], center2);
+            const pos = translatePosToCenter(
+              [options.center_x, options.center_y],
+              center2
+            );
             if (options.texts[0]) {
-              const poi = floor.poiLayer.createPoi({
+              const poi = new Poi2(this.bmap.context, {
                 id: options.id,
-                texts: [{ text: options.texts[0] }],
-                position: { x: pos[0], y: pos[1], z: options.airHeight }
+                text: options.texts[0],
+                position: {
+                  x: pos[0],
+                  y: pos[1],
+                  z: options.airHeight + options.height
+                }
               });
               if (poi) {
                 poi.userData.type = "parkingSpace";
                 poi.userData.data = options;
               }
+              floor.poiLayer2.pushPoi(poi);
             }
           });
           floor.userData.parkingSpaces = parkingSpacesGraphics;
@@ -7994,6 +8677,8 @@ var AibeeLoader = class {
     floor.userData.center = center2;
     floor.userData.height = data.floorHeight;
     floor.name = data.floor;
+    floor.userData.data = data;
+    floor.updateBox();
     return floor;
   }
   clear() {
@@ -8028,7 +8713,9 @@ export {
   Overlay,
   PathDirection,
   Poi,
+  Poi2,
   PoiLayer,
+  PoiLayer2,
   RoadNetwork,
   RoadNetwork2,
   SelectBox,
@@ -8061,6 +8748,7 @@ export {
   disposeLoader,
   distancePointToSegment,
   generatorKeyByObj,
+  getAngle,
   getCenter,
   getConfig,
   getDirectPath,
@@ -8068,6 +8756,7 @@ export {
   getLongestSideDir,
   getPathLength,
   getTextureByText,
+  getTextureByUrl,
   hasChinese,
   initCamera,
   initCanvas,