@aibee/crc-bmap 0.0.47 → 0.0.48

package/lib/bmap.esm.js

@@ -128,7 +128,14 @@ function initScene() {
   return scene;
 }
 function initRenderer() {
-  const renderer = new WebGLRenderer({ antialias: true });
+  const renderer = new WebGLRenderer({
+    antialias: true
+    // logarithmicDepthBuffer: true,
+    // alpha: false,
+    // premultipliedAlpha: false
+  });
+  renderer.autoClear = true;
+  renderer.setClearAlpha(1);
   renderer.setClearColor(16777215);
   renderer.setPixelRatio(window.devicePixelRatio);
   renderer.shadowMap.enabled = true;
@@ -370,6 +377,16 @@ function sleepOnePromise() {
 function strToNumber(str) {
   return parseInt(str.replace("#", "0x"), 16);
 }
+function addAlphaToHexColor(hexColor, alpha) {
+  let r = parseInt(hexColor.substring(1, 3), 16);
+  let g = parseInt(hexColor.substring(3, 5), 16);
+  let b = parseInt(hexColor.substring(5, 7), 16);
+  let newR = Math.round(r * alpha);
+  let newG = Math.round(g * alpha);
+  let newB = Math.round(b * alpha);
+  let newHexColor = `#${(1 << 24 | newR << 16 | newG << 8 | newB).toString(16).slice(1)}`;
+  return newHexColor;
+}
 
 // src/context.ts
 import {
@@ -391,16 +408,12 @@ import { EventDispatcher as EventDispatcher3 } from "three";
 import {
   Object3D,
   ExtrudeGeometry,
-  MeshStandardMaterial,
   Mesh,
-  Color as Color2,
   Box3,
-  Vector3
+  Vector3,
+  BufferGeometry,
+  LineSegments
 } from "three";
-import { merge } from "lodash";
-import { LineMaterial } from "three/examples/jsm/lines/LineMaterial.js";
-import { LineSegmentsGeometry } from "three/examples/jsm/lines/LineSegmentsGeometry.js";
-import { LineSegments2 } from "three/examples/jsm/lines/LineSegments2.js";
 var defaultOptions = {
   id: "",
   // 图形id
@@ -433,7 +446,9 @@ var defaultOptions = {
     curveIndex: []
   },
   layerType: "",
-  zIndex: 0
+  zIndex: 0,
+  stroke: true,
+  userData: {}
 };
 var Graphic = class extends Object3D {
   constructor(context, options) {
@@ -443,8 +458,10 @@ var Graphic = class extends Object3D {
     __publicField(this, "material");
     __publicField(this, "mesh");
     __publicField(this, "line");
+    __publicField(this, "lineMaterial");
+    __publicField(this, "lineGeometry");
     __publicField(this, "options");
-    this.options = proxyOptions(merge({}, defaultOptions, options), this);
+    this.options = proxyOptions(__spreadValues(__spreadValues({}, defaultOptions), options), this);
     if (this.options.geometry.type === "point") {
       const [x, y] = this.options.geometry.cds;
       this.position.set(x, y, this.options.height + this.options.airHeight);
@@ -453,23 +470,24 @@ var Graphic = class extends Object3D {
     this.init();
     this.visible = this.options.visible;
     this.addEventListener("change-fillColor", ({ value }) => {
-      this.material.color = new Color2(value);
+      this.initMaterial();
+      this.initMesh();
     });
     this.addEventListener("change-fillOpacity", ({ value }) => {
-      this.material.opacity = value;
+      this.initMaterial();
+      this.initMesh();
     });
     this.addEventListener("change-height", ({ value }) => {
       this.dispose();
       this.init();
     });
     this.addEventListener("change-strokeColor", ({ value }) => {
-      this.line.material.color = new Color2(value);
+      this.initLineMaterial();
+      this.createBorder();
     });
     this.addEventListener("change-strokeOpacity", ({ value }) => {
-      this.line.material.opacity = value;
-    });
-    this.addEventListener("change-strokeWidth", ({ value }) => {
-      this.line.material.linewidth = value;
+      this.initLineMaterial();
+      this.createBorder();
     });
     this.addEventListener("change-airHeight", ({ value }) => {
       this.position.z = value;
@@ -477,6 +495,20 @@ var Graphic = class extends Object3D {
     this.addEventListener("change-visible", ({ value }) => {
       this.visible = value;
     });
+    this.addEventListener("change-stroke", ({ value }) => {
+      var _a;
+      if (value) {
+        if (this.line) {
+          return;
+        }
+        this.initLineGeometry();
+        this.initLineMaterial();
+        this.createBorder();
+      } else if (this.line) {
+        this.remove(this.line);
+        (_a = this.lineGeometry) == null ? void 0 : _a.dispose();
+      }
+    });
   }
   getCenter() {
     if (this.options.geometry.type === "point") {
@@ -505,13 +537,14 @@ var Graphic = class extends Object3D {
   }
   init() {
     this.geometry = this.initGeometry();
-    this.material = this.initMaterial();
-    this.mesh = this.initMesh();
+    this.initMaterial();
+    this.initMesh();
     this.mesh.position.z = this.options.airHeight;
-    this.mesh.castShadow = true;
-    this.add(this.mesh);
-    this.line = this.createBorder();
-    this.add(this.line);
+    if (this.options.stroke) {
+      this.initLineMaterial();
+      this.initLineGeometry();
+      this.createBorder();
+    }
   }
   initGeometry() {
     const shape = initShape(
@@ -527,31 +560,27 @@ var Graphic = class extends Object3D {
     return geometry;
   }
   initMaterial() {
-    const material = new MeshStandardMaterial({
+    const material = this.context.materialFactory.createMeshStandardMaterial({
       color: this.options.fillColor,
-      roughness: 1,
-      transparent: true,
-      opacity: this.options.fillOpacity,
-      depthWrite: true
+      opacity: this.options.fillOpacity
     });
+    this.material = material;
     return material;
   }
   initLineMaterial() {
-    const lineMaterial = new LineMaterial({
-      color: new Color2(this.options.strokeColor).getHex(),
-      opacity: this.options.strokeOpacity,
-      transparent: true,
-      depthWrite: true,
-      linewidth: this.options.strokeWidth,
-      wireframe: false,
-      dashed: false
+    const lineMaterial = this.context.materialFactory.createLineMaterial({
+      color: this.options.strokeColor,
+      opacity: this.options.strokeOpacity
     });
-    const { clientSize: { width, height } } = this.context;
-    lineMaterial.resolution.set(width, height);
+    this.lineMaterial = lineMaterial;
     return lineMaterial;
   }
   initMesh() {
-    return new Mesh(this.geometry, this.material);
+    if (this.mesh) {
+      this.remove(this.mesh);
+    }
+    this.mesh = new Mesh(this.geometry, this.material);
+    this.add(this.mesh);
   }
   getBorderPoints() {
     const points = [];
@@ -562,35 +591,28 @@ var Graphic = class extends Object3D {
       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(cur[0], cur[1], 0);
-        points.push(next[0], next[1], 0);
-        points.push(cur[0], cur[1], height);
-        points.push(next[0], next[1], height);
-        if (j > 0) {
-          points.push(cur[0], cur[1], 0);
-          points.push(cur[0], cur[1], height);
-        } else {
-          if (curveIndex.length) {
-            if (curveIndex.includes(i)) {
-              points.push(cur[0], cur[1], 0);
-              points.push(cur[0], cur[1], height);
-            }
-          } else {
-            points.push(cur[0], cur[1], 0);
-            points.push(cur[0], cur[1], height);
-          }
-        }
+        points.push(new Vector3(cur[0], cur[1], height));
+        points.push(new Vector3(next[0], next[1], height));
       }
     }
     return points;
   }
-  createBorder() {
-    const material = this.initLineMaterial();
+  initLineGeometry() {
+    if (this.lineGeometry) {
+      this.lineGeometry.dispose();
+    }
     const points = this.getBorderPoints();
-    const lineGeometry = new LineSegmentsGeometry();
-    lineGeometry.setPositions(points);
-    const line = new LineSegments2(lineGeometry, material);
-    line.position.z = this.options.airHeight;
+    const lineGeometry = new BufferGeometry().setFromPoints(points);
+    this.lineGeometry = lineGeometry;
+  }
+  createBorder() {
+    if (this.line) {
+      this.remove(this.line);
+    }
+    const line = new LineSegments(this.lineGeometry, this.lineMaterial);
+    line.position.z = this.options.airHeight + 0.01;
+    this.line = line;
+    this.add(line);
     return line;
   }
   raycast(raycaster) {
@@ -608,7 +630,9 @@ var Graphic = class extends Object3D {
     return false;
   }
   dispose() {
-    dispose(this);
+    var _a;
+    this.geometry.dispose();
+    (_a = this.line) == null ? void 0 : _a.geometry.dispose();
     this.clear();
   }
 };
@@ -619,7 +643,7 @@ import {
   PlaneGeometry,
   Mesh as Mesh2,
   ShadowMaterial,
-  Color as Color3,
+  Color as Color2,
   DoubleSide
 } from "three";
 var Shadow = class extends Object3D2 {
@@ -649,7 +673,7 @@ var Shadow = class extends Object3D2 {
     this.directionalLight.shadow.camera.far = Math.max(x, y);
   }
   changeLightColor(color) {
-    this.directionalLight.color = new Color3(color);
+    this.directionalLight.color = new Color2(color);
   }
   setPosition(position) {
     this.position.copy(position);
@@ -686,7 +710,6 @@ var Shadow = class extends Object3D2 {
 
 // src/elements/poi.ts
 import { Object3D as Object3D4 } from "three";
-import { merge as merge2 } from "lodash";
 
 // src/elements/overlay.ts
 import { Box3 as Box32, EventDispatcher, Vector3 as Vector33 } from "three";
@@ -789,7 +812,7 @@ var Poi = class extends Object3D4 {
     __publicField(this, "_changePosition", () => {
       this.overlay.div.style.transform = `translate3d(-50%, ${this.options.icon ? "-100%" : "-50%"}, 0)`;
     });
-    this.options = proxyOptions(merge2({}, defaultOptions2, options), this);
+    this.options = proxyOptions(__spreadValues(__spreadValues({}, defaultOptions2), options), this);
     this.position.set(((_a = options.position) == null ? void 0 : _a.x) || 0, ((_b = options.position) == null ? void 0 : _b.y) || 0, ((_c = options.position) == null ? void 0 : _c.z) || 0);
     this.overlay = new Overlay(this.context);
     this.overlay.bindElement(this);
@@ -851,7 +874,7 @@ var Poi = class extends Object3D4 {
     if (this.options.icon) {
       div.appendChild(this.initIcon());
     }
-    div.style.fontSize = `14px`;
+    div.style.fontSize = `12px`;
     div.style.textShadow = `#fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0`;
     div.style.display = `flex`;
     div.style.flexDirection = `column`;
@@ -1269,6 +1292,7 @@ var Floor = class extends Object3D7 {
     grounds.forEach((ground) => {
       if (!this.grounds.has(ground)) {
         ground.options.height += ground.options.zIndex / 1e4;
+        ground.mesh.castShadow = true;
         this.grounds.add(ground);
         this.groundUpper.add(ground);
       }
@@ -2024,6 +2048,53 @@ var HoverHelper = class extends EventDispatcher4 {
   }
 };
 
+// src/factory/material.ts
+import { LineBasicMaterial as LineBasicMaterial2, MeshStandardMaterial as MeshStandardMaterial3 } from "three";
+var MaterialFactory = class {
+  constructor(context) {
+    this.context = context;
+    __publicField(this, "lineMaterialMap", /* @__PURE__ */ new Map());
+    __publicField(this, "meshStandardMaterialMap", /* @__PURE__ */ new Map());
+  }
+  generateLineMaterialKey({ color, opacity }) {
+    return `${color}-${opacity}`;
+  }
+  createLineMaterial({ color, opacity }) {
+    const key = this.generateLineMaterialKey({ color, opacity });
+    if (this.lineMaterialMap.has(key)) {
+      return this.lineMaterialMap.get(key);
+    }
+    const lineMaterial = new LineBasicMaterial2({
+      color,
+      transparent: true,
+      opacity
+    });
+    this.lineMaterialMap.set(key, lineMaterial);
+    return lineMaterial;
+  }
+  createMeshStandardMaterial({ color, opacity }) {
+    const key = `${color}-${opacity}`;
+    if (this.meshStandardMaterialMap.has(key)) {
+      return this.meshStandardMaterialMap.get(key);
+    }
+    const material = new MeshStandardMaterial3({
+      color,
+      roughness: 1,
+      transparent: true,
+      opacity,
+      depthWrite: true
+    });
+    this.meshStandardMaterialMap.set(key, material);
+    return material;
+  }
+  dispose() {
+    this.lineMaterialMap.forEach((val, _) => {
+      val.dispose();
+    });
+    this.lineMaterialMap.clear();
+  }
+};
+
 // src/context.ts
 var Context = class extends EventDispatcher5 {
   constructor(container, config) {
@@ -2043,6 +2114,7 @@ var Context = class extends EventDispatcher5 {
     __publicField(this, "hoverHelper");
     __publicField(this, "basicRatio");
     // zoom=1的时候，100M对应的像素个数
+    __publicField(this, "materialFactory");
     __publicField(this, "clientSize", {
       width: 0,
       height: 0
@@ -2096,6 +2168,7 @@ var Context = class extends EventDispatcher5 {
     this.init();
     this.selection = new Selection(this);
     this.hoverHelper = new HoverHelper(this);
+    this.materialFactory = new MaterialFactory(this);
     this.resizeClientSize();
     this.registryEvent();
   }
@@ -2241,6 +2314,7 @@ var Context = class extends EventDispatcher5 {
       this.control.update();
       this.control.maxAzimuthAngle = Infinity;
       this.control.minAzimuthAngle = Infinity;
+      return;
     }
     return timeoutPromise(
       new Promise((resolve) => {
@@ -2389,12 +2463,13 @@ var Context = class extends EventDispatcher5 {
     this.lights.children.forEach(
       (light) => light.dispose()
     );
+    this.materialFactory.dispose();
     dispose(this.scene);
   }
 };
 
 // src/config.ts
-import { merge as merge3 } from "lodash";
+import { merge } from "lodash";
 var defaultConfig = {
   apiDomain: "",
   apiInfo: {},
@@ -2412,7 +2487,8 @@ var defaultConfig = {
   },
   useFloorCache: true,
   control: {
-    maxPolar: 0.9
+    maxPolar: 1.2,
+    defaultPolar: 0.9
   },
   svg: {
     circle: {
@@ -2429,10 +2505,26 @@ var defaultConfig = {
   },
   hover: {
     time: 500
+  },
+  ground: {
+    color: "#ffffff",
+    opacity: 1,
+    height: 5,
+    stroke: true,
+    strokeColor: "#E6E6E6",
+    strokeOpacity: 1
+  },
+  markGraphic: {
+    color: "#ecf0f7",
+    opacity: 1,
+    height: 1e-3,
+    stroke: false,
+    strokeColor: "#000",
+    strokeOpacity: 1
   }
 };
 function getConfig(config) {
-  return merge3({}, defaultConfig, config);
+  return merge({}, defaultConfig, config);
 }
 
 // src/bmap.ts
@@ -2562,6 +2654,26 @@ var BMap = class extends EventDispatcher6 {
           item.info.transformToBuildingGround = true;
         });
       }
+      const { ground, markGraphic } = this.config;
+      for (const item of data) {
+        if (item.info.group === "ground") {
+          item.info.fillColor = ground.color;
+          item.info.fillOpacity = ground.opacity;
+          item.info.height = ground.height;
+          item.info.stroke = ground.stroke;
+          item.info.strokeColor = ground.strokeColor;
+          item.info.strokeOpacity = ground.strokeOpacity;
+        } else {
+          if (item.info.userData.mark) {
+            item.info.height = markGraphic.height;
+            item.info.fillColor = markGraphic.color;
+            item.info.fillOpacity = markGraphic.opacity;
+            item.info.stroke = markGraphic.stroke;
+            item.info.strokeColor = markGraphic.strokeColor;
+            item.info.strokeOpacity = markGraphic.strokeOpacity;
+          }
+        }
+      }
       if (!this.config.useFloorCache) {
         this.floorDataMap.clear();
       }
@@ -2574,23 +2686,18 @@ var BMap = class extends EventDispatcher6 {
     if (!data.length) {
       return { curFloor, graphics: [] };
     }
-    const grounds = data.filter((item) => item.info.group === "ground");
-    grounds.forEach((item) => {
-      item.info.fillColor = "#F2F6FC";
-      item.info.fillOpacity = 1;
-      item.info.strokeOpacity = 0;
-      item.info.height = 5;
-    });
-    const groundGraphics = grounds.map((ground) => new Graphic(this.context, ground.info));
-    curFloor.addGrounds(groundGraphics);
-    const graphicData = data.filter((item) => item.info.group !== "ground");
     const legacyToGraphicMap = /* @__PURE__ */ new Map();
-    const graphics = graphicData.map((item) => {
-      const graphic = curFloor.addGraphic(item.info);
-      graphic.userData.data = item;
-      legacyToGraphicMap.set(item.legacy_id, graphic);
-      return graphic;
-    });
+    const graphics = [];
+    for (const item of data) {
+      if (item.info.group === "ground") {
+        curFloor.addGrounds([new Graphic(this.context, item.info)]);
+      } else {
+        const graphic = curFloor.addGraphic(item.info);
+        graphic.userData.data = item;
+        legacyToGraphicMap.set(item.legacy_id, graphic);
+        graphics.push(graphic);
+      }
+    }
     curFloor.addShadow();
     curFloor.userData.legacyToGraphicMap = legacyToGraphicMap;
     return { curFloor, graphics };
@@ -2894,6 +3001,7 @@ export {
   SvgLine,
   SvgPolygon,
   Timer,
+  addAlphaToHexColor,
   clearCanvas,
   clearTextTexture,
   createCanvas,