venue-js 1.3.0 → 1.4.0-next.1

package/dist/index.mjs

@@ -322,6 +322,7 @@ import {
 } from "@tanstack/query-core";
 
 // src/data/populator/index.ts
+import { compact as compact2 } from "lodash-es";
 import { booleanWithin } from "@turf/boolean-within";
 var createPopulator = ({
   internalFindById,
@@ -405,7 +406,14 @@ var createPopulator = ({
     const anchor = await internalFindById(kiosk.properties.anchor_id);
     const units = await internalFilterByType("unit");
     const unit = units.find(
-      (unit2) => unit2.properties.category === "walkway" && unit2.properties.level_id === kiosk.properties.level_id && booleanWithin(kiosk, unit2)
+      (unit2) => {
+        try {
+          return unit2.properties.category === "walkway" && unit2.properties.level_id === kiosk.properties.level_id && booleanWithin(kiosk, unit2);
+        } catch (e) {
+          console.log(`Cannot find kiosk(${kiosk.id})'s units:`, e.message);
+          return false;
+        }
+      }
     );
     let section = null;
     if (anchor) {
@@ -468,7 +476,7 @@ var createPopulator = ({
         ...occupant.properties,
         anchor: anchor ? await populateAnchor(anchor) : null,
         local_categories: await Promise.all(
-          localCategories.map(populateTaxonomy)
+          compact2(localCategories).map(populateTaxonomy)
         ),
         venue,
         promotions,
@@ -2673,9 +2681,9 @@ var CameraManager = class {
 };
 
 // src/IndoorMap/renderer/RendererManager.ts
-import { min, compact as compact2, isFunction } from "lodash-es";
+import { min, compact as compact3, isFunction } from "lodash-es";
 import { center as turfCenter2 } from "@turf/center";
-import * as THREE3 from "three";
+import * as THREE4 from "three";
 
 // src/IndoorMap/renderer/3d/Element3DRenderer.ts
 import * as maptalks4 from "maptalks-gl";
@@ -3024,7 +3032,7 @@ var DEFAULT_POLYGON_OPTION = {
   offset: 0,
   altitude: 0
 };
-var get3DRendererOption = (featureType, category, options) => {
+var get3DRendererOption = (featureType, category, options = {}) => {
   try {
     const option = options[featureType] ?? element3DRendererOptions[featureType];
     return (category && option.byCategory?.[category]) ?? option?.default ?? DEFAULT_POLYGON_OPTION;
@@ -3485,6 +3493,12 @@ var Marker2DRenderer = class extends EventTarget {
     marker.addTo(this.map);
     return marker;
   };
+  createTextMarker = (position, label, options) => {
+    return null;
+  };
+  createImageMarker = (position, src, options) => {
+    return null;
+  };
   removeMarker = (marker) => {
     marker.remove();
   };
@@ -3496,6 +3510,7 @@ var Marker2DRenderer = class extends EventTarget {
 
 // src/IndoorMap/renderer/3d/Marker3DRenderer.ts
 import * as maptalks7 from "maptalks-gl";
+import * as THREE3 from "three";
 
 // src/IndoorMap/renderer/3d/objects/TextSpriteMarker.ts
 import { Coordinate as Coordinate2, Util as Util4 } from "maptalks";
@@ -3695,21 +3710,35 @@ var TextSpriteMarker = class extends BaseObject6 {
 };
 
 // src/IndoorMap/renderer/3d/Marker3DRenderer.ts
-var HEIGHT_METER2 = 4;
-var MULTIORDINAL_HEIGHT_METER3 = 9;
 var Marker3DRenderer = class extends EventTarget {
   isReady = false;
   threeLayer;
   map;
-  materialByKey;
   constructor(map, options, layer) {
     super();
     this.map = map;
     this.threeLayer = layer;
   }
-  createTextMarker = (position, ordinal, label, options) => {
+  createPointMaterialFromSvg(svgPath, size = 40) {
+    return new THREE3.PointsMaterial({
+      size,
+      sizeAttenuation: false,
+      // Always same size in screen pixels (Screen pixel)
+      // color: fillStyle, 
+      alphaTest: 0.5,
+      // vertexColors: THREE.VertexColors,
+      // color: 0xffffff,
+      transparent: true,
+      blending: THREE3.NormalBlending,
+      depthTest: true,
+      // POI is hidden behind building
+      depthWrite: true,
+      map: new THREE3.TextureLoader().load(svgPath)
+    });
+  }
+  createTextMarker = (position, label, options) => {
     const combinedOptions = {
-      altitude: ordinal * HEIGHT_METER2,
+      altitude: 0,
       text: label,
       ...options ?? {}
     };
@@ -3718,17 +3747,37 @@ var Marker3DRenderer = class extends EventTarget {
     this.threeLayer.addMesh([marker]);
     return marker;
   };
-  createImageMarker = () => {
-  };
-  createMarker = (coordinates, ordinal, label, options) => {
-    return this.createTextMarker(coordinates, ordinal, label, options);
+  createImageMarker = (position, src, options) => {
+    const [lng, lat] = position;
+    let meshes = [];
+    const height = options.height ?? 0;
+    const { leg, ...markerOptions } = options;
+    const { color: legColor = "#000000", ...legOptions } = leg ?? {};
+    const material = this.createPointMaterialFromSvg(src, 40);
+    const marker = this.threeLayer.toPoint(new maptalks7.Coordinate(lng, lat), { height, ...markerOptions }, material);
+    marker.getObject3d().renderOrder = 10;
+    meshes.push(marker);
+    if (options.leg) {
+      const legMaterial = new THREE3.MeshLambertMaterial({ color: legColor, transparent: true });
+      const leg2 = this.threeLayer.toBar(new maptalks7.Coordinate(lng, lat), { ...legOptions, height }, legMaterial);
+      const legObj = leg2.getObject3d();
+      legObj.traverse((o) => {
+        if (o.isMesh && o.material) {
+          o.material.depthWrite = false;
+          o.material.depthTest = true;
+          o.renderOrder = 0;
+        }
+      });
+      meshes = [leg2, ...meshes];
+    }
+    this.threeLayer.addMesh(meshes);
+    return meshes;
   };
   removeMarker = (marker) => {
     marker.remove();
   };
   showMarkers(elements, ordinalDiff = 0) {
     elements.forEach((element) => {
-      element.setAltitude(ordinalDiff * MULTIORDINAL_HEIGHT_METER3);
       element.show();
     });
   }
@@ -4267,7 +4316,11 @@ function inBBox(pt, bbox2) {
 
 // src/IndoorMap/renderer/utils/findUnitOnPoint.ts
 var findUnitOnPoint = (units, point2) => {
-  return units.find((unit) => booleanPointInPolygon(point2, polygon(unit.geometry.coordinates)));
+  try {
+    return units.find((unit) => booleanPointInPolygon(point2, polygon(unit.geometry.coordinates)));
+  } catch (err) {
+    return null;
+  }
 };
 
 // src/IndoorMap/renderer/RendererManager.ts
@@ -4337,13 +4390,13 @@ var RendererManager = class extends EventTarget {
           }
           return bad;
         }
-        const ambientLight = new THREE3.AmbientLight(16777215, 0.3);
+        const ambientLight = new THREE4.AmbientLight(16777215, 0.3);
         scene.add(ambientLight);
         const dirColor = 16777215;
-        const dllight = new THREE3.DirectionalLight(dirColor, 0.8);
+        const dllight = new THREE4.DirectionalLight(dirColor, 0.8);
         dllight.position.set(0, -10, 20).normalize();
         scene.add(dllight);
-        const hemi = new THREE3.HemisphereLight(16777215, 4473924, 0.4);
+        const hemi = new THREE4.HemisphereLight(16777215, 4473924, 0.4);
         scene.add(hemi);
         _this.elementRenderer = new Element3DRenderer(map, options.elements);
         _this.markerRenderer = new Marker3DRenderer(map, {}, threeLayer);
@@ -4421,12 +4474,12 @@ var RendererManager = class extends EventTarget {
     });
     units.filter((u4) => u4.properties.category === "room").forEach((unit) => {
       const openingRelationships = relationships.filter((r) => r.properties.origin?.id === unit.id || r.properties.destination?.id === unit.id);
-      const roomOpenings = compact2(openingRelationships.map((rel) => {
+      const roomOpenings = compact3(openingRelationships.map((rel) => {
         const openingId = rel?.properties.intermediary[0].id;
         return openings.find((o) => o.id === openingId);
       }));
       const innerElements = this.elementRenderer.createGeometry(unit);
-      const wallElements = this.elementRenderer.createRoomWall(unit, roomOpenings);
+      const wallElements = [];
       if (innerElements || wallElements) {
         const _innerElements = Array.isArray(innerElements) ? innerElements : [innerElements];
         const _wallElements = Array.isArray(wallElements) ? wallElements : [wallElements];
@@ -4481,10 +4534,12 @@ var RendererManager = class extends EventTarget {
     for (const label of groundLabels) {
       const center2 = turfCenter2(polygon(label.geometry.coordinates)).geometry.coordinates;
       const unit = findUnitOnPoint(units, center2);
-      const element = this.elementRenderer.createGroundLabel(label, unit);
-      if (element) {
-        const _elements = Array.isArray(element) ? element : [element];
-        this.addElementsToManager(label.id, _elements, label.properties.ordinal);
+      if (unit) {
+        const element = this.elementRenderer.createGroundLabel(label, unit);
+        if (element) {
+          const _elements = Array.isArray(element) ? element : [element];
+          this.addElementsToManager(label.id, _elements, label.properties.ordinal);
+        }
       }
     }
     if (this.options.type === "3D") {
@@ -4566,10 +4621,11 @@ var RendererManager = class extends EventTarget {
       this.markerRenderer.hideMarkers(markers, ordinal);
     }
   };
-  createMarker(coordinate, ordinal, text, options) {
-    const marker = this.markerRenderer.createMarker(coordinate, ordinal, text, options);
+  createMarker(type, coordinate, ordinal, textOrPath, options) {
+    const meshes = type === "text" ? this.markerRenderer.createTextMarker(coordinate, textOrPath, options) : this.markerRenderer.createImageMarker(coordinate, textOrPath, options);
     const markerId = `${this.markersMap.size + 1}`;
-    this._addMarkersToManager(markerId, [marker], ordinal);
+    const markerMeshes = Array.isArray(meshes) ? meshes : [meshes];
+    this._addMarkersToManager(markerId, markerMeshes, ordinal);
   }
   clearMarkers() {
     for (const [markerId, marker] of this.markersMap) {
@@ -4709,6 +4765,7 @@ var IndoorMap = class extends EventTarget {
     this.#dataClient = value;
     if (!this.options.camera?.defaultView?.center) {
       this.#dataClient.filterByType("venue").then((venues) => {
+        this.#venues = venues;
         const venueCenters = turfCenter3(featureCollection(venues));
         const [x, y] = venueCenters.geometry.coordinates;
         const center2 = new Coordinate4(x, y);