venue-js 1.2.0-next.8 → 1.2.0-next.9

package/dist/index.mjs

@@ -777,7 +777,7 @@ function isNumber(num) {
 import turfDistance from "@turf/distance";
 import turfCenter3 from "@turf/center";
 import { PerspectiveCamera } from "three";
-import { ThreeLayer as ThreeLayer3 } from "maptalks.three";
+import { ThreeLayer as ThreeLayer4 } from "maptalks.three";
 
 // src/IndoorMap/constants.ts
 var defaultLayerOption = { enableAltitude: true };
@@ -3103,6 +3103,7 @@ var CameraManager = class {
 };
 
 // src/IndoorMap/renderer/RendererManager.ts
+import _isFunction from "lodash/isFunction";
 import _min from "lodash/min";
 import { center as turfCenter2 } from "@turf/center";
 import * as THREE3 from "three";
@@ -3110,6 +3111,7 @@ import * as THREE3 from "three";
 // src/IndoorMap/renderer/3d/Element3DRenderer.ts
 import * as maptalks4 from "maptalks-gl";
 import * as THREE from "three";
+import { BaseObject as BaseObject5 } from "maptalks.three";
 import turfBuffer2 from "@turf/buffer";
 
 // src/IndoorMap/renderer/3d/element3DRendererOptions.ts
@@ -3160,6 +3162,7 @@ var Element3DRenderer = class extends EventTarget {
   map;
   gltfLayer;
   threeLayer;
+  scene;
   // private dracoLoader: DRACOLoader
   lineMaterial;
   materialByColorMap;
@@ -3291,6 +3294,9 @@ var Element3DRenderer = class extends EventTarget {
     treeMarker.addTo(this.gltfLayer);
     return treeMarker;
   }
+  async createBuilding(coordinate, ordinal) {
+    return Promise.resolve(null);
+  }
   createElement(f) {
     switch (f.feature_type) {
       default:
@@ -3312,6 +3318,34 @@ var Element3DRenderer = class extends EventTarget {
       }
     });
   }
+  createHighlightController(element) {
+    if (!(element instanceof BaseObject5)) {
+      return null;
+    }
+    switch (element.type) {
+      case "ExtrudePolygon": {
+        const mesh = element.getObject3d();
+        const originalMaterial = mesh.material;
+        const highlightMaterial = this.getOrCreateMaterialByColor("#ff0000");
+        return {
+          start: () => {
+            mesh.material = highlightMaterial;
+          },
+          clear: () => {
+            mesh.material = originalMaterial;
+          }
+        };
+      }
+      default: {
+        return {
+          start() {
+          },
+          clear() {
+          }
+        };
+      }
+    }
+  }
   render() {
     this.threeLayer._needsUpdate = !this.threeLayer._needsUpdate;
     if (this.threeLayer._needsUpdate) {
@@ -3419,7 +3453,10 @@ var Element2DRenderer = class extends EventTarget {
   async createEscalator(f, coordinates) {
     return Promise.resolve(null);
   }
-  async createTree(f, coordinates) {
+  async createTree(coordinates) {
+    return Promise.resolve(null);
+  }
+  async createBuilding(coordinate, ordinal) {
     return Promise.resolve(null);
   }
   createElement = (imdfFeature) => {
@@ -3439,6 +3476,15 @@ var Element2DRenderer = class extends EventTarget {
       element.hide();
     });
   }
+  createHighlightController(element) {
+    if (!(element instanceof maptalks5.Geometry)) return null;
+    return {
+      start() {
+      },
+      clear() {
+      }
+    };
+  }
 };
 
 // src/IndoorMap/renderer/2d/Marker2DRenderer.ts
@@ -3476,7 +3522,7 @@ import * as maptalks7 from "maptalks-gl";
 // src/IndoorMap/renderer/3d/objects/TextSpriteMarker.ts
 import { Coordinate as Coordinate2, Util as Util4 } from "maptalks";
 import * as THREE2 from "three";
-import { BaseObject as BaseObject5 } from "maptalks.three";
+import { BaseObject as BaseObject6 } from "maptalks.three";
 import { isNil, set } from "lodash";
 
 // src/IndoorMap/renderer/utils/interpolateStops.ts
@@ -3514,7 +3560,7 @@ var OPTIONS4 = {
   altitude: 0,
   opacity: 1
 };
-var TextSpriteMarker = class extends BaseObject5 {
+var TextSpriteMarker = class extends BaseObject6 {
   #altitudeOffset = 0;
   constructor(coordinate, options, layer, properties = {}) {
     options = Util4.extend({}, OPTIONS4, options, { layer });
@@ -3782,6 +3828,9 @@ var RendererManager = class extends EventTarget {
   options;
   // Client for fetching data
   #dataClient;
+  #isClicked = false;
+  #onClickElement = (e) => {
+  };
   /** Elements: Responsible for converting feature info elements and add to map */
   elementRenderer;
   markerRenderer;
@@ -3790,6 +3839,7 @@ var RendererManager = class extends EventTarget {
   currentOrdinals;
   markersMap;
   markersByOrdinal;
+  highlightControllers = [];
   constructor(map, dataClient, options) {
     super();
     this.map = map;
@@ -3808,7 +3858,7 @@ var RendererManager = class extends EventTarget {
         scene.add(ambientLight);
         const dirColor = 16777215;
         const dllight = new THREE3.DirectionalLight(dirColor, 0.8);
-        dllight.position.set(0, -10, 10).normalize();
+        dllight.position.set(0, -10, 20).normalize();
         scene.add(dllight);
         const hemi = new THREE3.HemisphereLight(16777215, 4473924, 0.4);
         scene.add(hemi);
@@ -3825,19 +3875,27 @@ var RendererManager = class extends EventTarget {
       this.#createElements();
     }
   }
+  set onClickElement(func) {
+    this.#onClickElement = func;
+  }
+  handleClickElement = (e) => {
+    console.log(`handleClickElement`, this.#isClicked);
+    if (this.#isClicked) return;
+    this.#isClicked = true;
+    const onClickElement = this.#onClickElement;
+    if (!_isFunction(onClickElement)) return;
+    this.#onClickElement(e);
+    this.#isClicked = false;
+  };
   getElementsByOrdinal = (ordinal) => {
     const exist = this.elementsByOrdinal.get(ordinal);
     if (!exist) this.elementsByOrdinal.set(ordinal, []);
     return this.elementsByOrdinal.get(ordinal);
   };
-  getMarkersByOrdinal = (ordinal) => {
-    const exist = this.markersByOrdinal.get(ordinal);
-    if (!exist) this.markersByOrdinal.set(ordinal, []);
-    return this.markersByOrdinal.get(ordinal);
-  };
   addElementsToManager = (id, elements, ordinal) => {
     this.elementsMap.set(id, elements);
     elements.forEach((el) => {
+      el.on("click", (e) => this.handleClickElement(id));
       this.getElementsByOrdinal(ordinal).push(el);
     });
     const inOrdinal = Array.isArray(this.currentOrdinals) ? this.currentOrdinals.includes(ordinal) : ordinal === this.currentOrdinals;
@@ -3847,18 +3905,6 @@ var RendererManager = class extends EventTarget {
       this.elementRenderer.hideElements(elements, ordinal);
     }
   };
-  addMarkersToManager = (id, markers, ordinal) => {
-    this.markersMap.set(id, markers);
-    markers.forEach((el) => {
-      this.getMarkersByOrdinal(ordinal).push(el);
-    });
-    const inOrdinal = Array.isArray(this.currentOrdinals) ? this.currentOrdinals.includes(ordinal) : ordinal === this.currentOrdinals;
-    if (inOrdinal) {
-      this.markerRenderer.showMarkers(markers, ordinal);
-    } else {
-      this.markerRenderer.hideMarkers(markers, ordinal);
-    }
-  };
   async #createElements() {
     await delay(this.options.delayBeforeCreateElements ?? 0);
     const levels = await this.#dataClient.filterByType("level", {
@@ -3960,14 +4006,48 @@ var RendererManager = class extends EventTarget {
       }
     }
   }
+  highlightElements = (elemIds, options) => {
+    const { reset = true } = options ?? {};
+    if (reset) {
+      this.clearHighlightElements();
+    }
+    const elements = elemIds.map((id) => this.elementsMap.get(id)).flat();
+    elements.forEach((element) => {
+      const controller = this.elementRenderer.createHighlightController(element);
+      controller.start();
+      this.highlightControllers.push(controller);
+    });
+  };
+  clearHighlightElements = () => {
+    this.highlightControllers.forEach((controller) => {
+      if (_isFunction(controller?.clear)) controller.clear();
+    });
+  };
   /** 
    * ========================================================================
    * Markers
    * ======================================================================== */
+  _getMarkersByOrdinal = (ordinal) => {
+    const exist = this.markersByOrdinal.get(ordinal);
+    if (!exist) this.markersByOrdinal.set(ordinal, []);
+    return this.markersByOrdinal.get(ordinal);
+  };
+  _addMarkersToManager = (id, markers, ordinal) => {
+    this.markersMap.set(id, markers);
+    markers.forEach((el) => {
+      this._getMarkersByOrdinal(ordinal).push(el);
+    });
+    const inOrdinal = Array.isArray(this.currentOrdinals) ? this.currentOrdinals.includes(ordinal) : ordinal === this.currentOrdinals;
+    if (inOrdinal) {
+      this.markerRenderer.showMarkers(markers, ordinal);
+    } else {
+      this.markerRenderer.hideMarkers(markers, ordinal);
+    }
+  };
   createMarker(coordinate, ordinal, text, options) {
     const marker = this.markerRenderer.createMarker(coordinate, ordinal, text, options);
     const markerId = `${this.markersMap.size + 1}`;
-    this.addMarkersToManager(markerId, [marker], ordinal);
+    this._addMarkersToManager(markerId, [marker], ordinal);
   }
   clearMarkers() {
     for (const [markerId, marker] of this.markersMap) {
@@ -4065,7 +4145,7 @@ var IndoorMap = class extends EventTarget {
       layers: []
     });
     const groupLayer = new GroupGLLayer("group", [], {}).addTo(this.map);
-    const threeLayer = new ThreeLayer3("three", {
+    const threeLayer = new ThreeLayer4("three", {
       forceRenderOnMoving: true,
       forceRenderOnRotating: true
     });
@@ -4167,7 +4247,7 @@ var IndoorMap = class extends EventTarget {
     this.map.setDevicePixelRatio(value);
   }
   set onClickElement(func) {
-    this.#onClickElement = func;
+    this.rendererManager.onClickElement = func;
   }
   set locale(value) {
     this.#locale = value || defaultOptions.locale;
@@ -4216,7 +4296,6 @@ var IndoorMap = class extends EventTarget {
     } = this.#styler;
     let elements = {};
     let object3ds = [];
-    const scene = this.threeLayer.getScene();
     for (const feature2 of this.#features) {
       try {
         const { feature_type: featureType, properties, id } = feature2;