hn-map 1.1.2 → 1.1.3

package/src/layer/layer.ts

@@ -1,464 +1,479 @@
-import {deepMerge} from "../util";
+import { deepMerge } from "../util";
 
 export default (hnMap: any) => {
-    const defaultOption = {};
-
-    class mars3d_class {
-        type: any = "layer";
-        id: any = null;
-        option: any = JSON.parse(JSON.stringify(defaultOption));
-        config: any = null;
-        children: any = null;
-        layerEntity: any = null;
-
-        constructor(option: any) {
-            this.id = option.id;
-            this.children = [];
-            deepMerge(this.option, option);
-            this.config = this.formatConfig(this.option);
-            this.layerEntity = new mars3d.layer.GraphicLayer(this.config); // 创建图层
-        }
+  const defaultOption = {};
+
+  class mars3d_class {
+    type: any = "layer";
+    id: any = null;
+    option: any = JSON.parse(JSON.stringify(defaultOption));
+    config: any = null;
+    children: any = null;
+    layerEntity: any = null;
+
+    constructor(option: any) {
+      this.id = option.id;
+      this.children = [];
+      deepMerge(this.option, option);
+      this.config = this.formatConfig(this.option);
+      this.layerEntity = new mars3d.layer.GraphicLayer(this.config); // 创建图层
+    }
 
-        formatConfig(option: any) {
-            return option;
-        }
+    formatConfig(option: any) {
+      return option;
+    }
 
-        getEntity(id: any) {
-            return this.children.find((v: any) => v.id === id);
-        }
+    getEntity(id: any) {
+      return this.children.find((v: any) => v.id === id);
+    }
 
-        addEntity(entity: any) {
-            if (this.children.find((v: any) => v.id === entity.id)) {
-                console.error("已存在同名图形" + entity.id);
-            } else {
-                this.children.push(entity);
-                this.layerEntity.addGraphic(entity.graphic); // 添加图形
-                if (entity.type == "route") {
-                    entity.start();
-                }
-            }
+    addEntity(entity: any) {
+      if (this.children.find((v: any) => v.id === entity.id)) {
+        console.error("已存在同名图形" + entity.id);
+      } else {
+        this.children.push(entity);
+        this.layerEntity.addGraphic(entity.graphic); // 添加图形
+        if (entity.type == "route") {
+          entity.start();
         }
+      }
+    }
 
-        removeEntity(entityParam: any) {
-            const entity = this.getEntity(entityParam);
-            if (entity) {
-                this.layerEntity.removeGraphic(entity.graphic);
-            }
-        }
+    removeEntity(entityParam: any) {
+      const entity = this.getEntity(entityParam);
+      if (entity) {
+        this.layerEntity.removeGraphic(entity.graphic);
+      }
+    }
 
-        clearEntity() {
-            this.children.forEach((v: any) => v.destroy());
-            this.children = [];
-            this.layerEntity.clear();
-        }
+    clearEntity() {
+      this.children.forEach((v: any) => v.destroy());
+      this.children = [];
+      this.layerEntity.clear();
+    }
 
-        destroy() {
-            this.clearEntity();
-            this.layerEntity.remove(true);
-            hnMap.map.layerList = hnMap.map.layerList.filter(
-                (v: any) => v.id !== this.id
-            );
-        }
+    destroy() {
+      this.clearEntity();
+      this.layerEntity.remove(true);
+      hnMap.map.layerList = hnMap.map.layerList.filter(
+        (v: any) => v.id !== this.id
+      );
+    }
 
-        show() {
-            this.layerEntity.show = true;
-        }
+    show() {
+      this.layerEntity.show = true;
+    }
 
-        hide() {
-            this.layerEntity.show = false;
-        }
+    hide() {
+      this.layerEntity.show = false;
+    }
 
-        flyTo() {
-            this.layerEntity.flyTo();
-        }
+    flyTo() {
+      this.layerEntity.flyTo();
+    }
 
-        /**
-         * 飞向指定的多个图形
-         * @param entities
-         */
-        flyToCustomEntities(entities: any) {
-            // 计算所有线的最小最大坐标
-            let minLon = 180,
-                maxLon = -180,
-                minLat = 90,
-                maxLat = -90;
-
-            entities.forEach((line: any) => {
-                line.graphic.positions.forEach((pos: any) => {
-                    const carto = mars3d.Cesium.Cartographic.fromCartesian(pos);
-                    const lon = mars3d.Cesium.Math.toDegrees(carto.longitude);
-                    const lat = mars3d.Cesium.Math.toDegrees(carto.latitude);
-
-                    minLon = Math.min(minLon, lon);
-                    maxLon = Math.max(maxLon, lon);
-                    minLat = Math.min(minLat, lat);
-                    maxLat = Math.max(maxLat, lat);
-                });
-            });
-
-            // 飞到这个矩形范围
-            hnMap.map.map.flyToExtent({
-                xmin: minLon,
-                xmax: maxLon,
-                ymin: minLat,
-                ymax: maxLat,
-            });
-        }
+    /**
+     * 飞向指定的多个图形
+     * @param entities
+     */
+    flyToCustomEntities(entities: any) {
+      // 计算所有线的最小最大坐标
+      let minLon = 180,
+        maxLon = -180,
+        minLat = 90,
+        maxLat = -90;
+
+      entities.forEach((line: any) => {
+        line.graphic.positions.forEach((pos: any) => {
+          const carto = mars3d.Cesium.Cartographic.fromCartesian(pos);
+          const lon = mars3d.Cesium.Math.toDegrees(carto.longitude);
+          const lat = mars3d.Cesium.Math.toDegrees(carto.latitude);
+
+          minLon = Math.min(minLon, lon);
+          maxLon = Math.max(maxLon, lon);
+          minLat = Math.min(minLat, lat);
+          maxLat = Math.max(maxLat, lat);
+        });
+      });
+
+      // 飞到这个矩形范围
+      hnMap.map.map.flyToExtent({
+        xmin: minLon,
+        xmax: maxLon,
+        ymin: minLat,
+        ymax: maxLat,
+      });
+    }
 
-        // 添加属性弹窗
-        addPopupByAttr() {
-            this.layerEntity.bindPopup((event: any) => {
-                console.log(event.graphic, "====event.graphic==");
-                if (event.graphic.attr) {
-                    const data = event.graphic.attr;
-                    return mars3d.Util.getTemplateHtml({
-                        title: "详情",
-                        template: "all",
-                        attr: data,
-                    });
-                }
-            });
-        }
+    // 添加属性弹窗
+    addPopupByAttr() {
+      this.layerEntity.bindPopup((event: any) => {
+        console.log(event.graphic, "====event.graphic==");
+        if (event.graphic.attr) {
+          const data = event.graphic.attr;
+          return mars3d.Util.getTemplateHtml({
+            title: "详情",
+            template: "all",
+            attr: data,
+          });
+        }
+      });
+    }
 
-        // 添加自定义dom弹窗
-        addCustomPopup(getCustomDom: any, option = {offsetY: -20}) {
-            this.layerEntity.bindPopup(async (event: any) => {
-                if (event.graphic.attr) {
-                    const data = event.graphic.attr || {};
-                    const dom = await getCustomDom(data);
-                    if (dom) {
-                        return dom;
-                    } else {
-                        hnMap.map.closePopup();
-                    }
-                }
-            }, option);
-        }
+    // 添加自定义dom弹窗
+    addCustomPopup(getCustomDom: any, option = { offsetY: -20 }) {
+      this.layerEntity.bindPopup(async (event: any) => {
+        if (event.graphic.attr) {
+          const data = event.graphic.attr || {};
+          const dom = await getCustomDom(data);
+          if (dom) {
+            return dom;
+          } else {
+            hnMap.map.closePopup();
+          }
+        }
+      }, option);
+    }
+  }
+
+  class gaode_class {
+    id: any = null;
+    option: any = JSON.parse(JSON.stringify(defaultOption));
+    config: any = null;
+    children: any = null;
+    layerEntity: any = null;
+    // 创建全局信息窗口实例
+    propsInfoWindow: any = null;
+    customInfoWindow: any = null;
+    getCustomDom: any = null;
+
+    constructor(option: any) {
+      this.id = option.id;
+      this.children = [];
+      deepMerge(this.option, option);
+      this.config = this.formatConfig(this.option);
+      this.layerEntity = new AMap.OverlayGroup([]); // 创建图层
+      this.layerEntity.id = option.id;
     }
 
-    class gaode_class {
-        id: any = null;
-        option: any = JSON.parse(JSON.stringify(defaultOption));
-        config: any = null;
-        children: any = null;
-        layerEntity: any = null;
-        // 创建全局信息窗口实例
-        propsInfoWindow: any = null;
-        customInfoWindow: any = null;
-        getCustomDom: any = null;
-
-        constructor(option: any) {
-            this.id = option.id;
-            this.children = [];
-            deepMerge(this.option, option);
-            this.config = this.formatConfig(this.option);
-            this.layerEntity = new AMap.OverlayGroup([]); // 创建图层
-            this.layerEntity.id = option.id;
-        }
+    formatConfig(option: any) {
+      return option;
+    }
 
-        formatConfig(option: any) {
-            return option;
-        }
+    getEntity(entityParam: any) {
+      return this.children.find((v: any) => v.id === entityParam);
+    }
 
-        getEntity(entityParam: any) {
-            return this.children.find((v: any) => v.id === entityParam);
+    addEntity(entity: any) {
+      if (this.children.find((v: any) => v.id === entity.id)) {
+        console.error("已存在同名图形" + entity.id);
+      } else {
+        alert(entity.id);
+        this.children.push(entity);
+        this.layerEntity.addOverlay(entity.graphic); // 添加图形
+
+        // 图层添加新图形后，需要重新调用绑定点击弹窗方法
+        if (this.propsInfoWindow) {
+          this.addPopupByAttr();
         }
 
-        addEntity(entity: any) {
-            if (this.children.find((v: any) => v.id === entity.id)) {
-                console.error("已存在同名图形" + entity.id);
-            } else {
-                this.children.push(entity);
-                this.layerEntity.addOverlay(entity.graphic); // 添加图形
-
-                // 图层添加新图形后，需要重新调用绑定点击弹窗方法
-                if (this.propsInfoWindow) {
-                    this.addPopupByAttr();
-                }
-
-                if (this.customInfoWindow) {
-                    // this.addCustomPopup()
-                }
-            }
+        if (this.customInfoWindow) {
+          // this.addCustomPopup()
         }
+      }
+    }
 
-        removeEntity(entityParam: any) {
-            const entity = this.getEntity(entityParam);
+    removeEntity(entityParam: any) {
+      const entity = this.getEntity(entityParam);
 
-            if (entity) {
-                this.children = this.children.filter((v: any): any => {
-                    return v.id !== entity.id;
-                });
+      if (entity) {
+        this.children = this.children.filter((v: any): any => {
+          return v.id !== entity.id;
+        });
 
-                this.layerEntity.removeOverlay(entity.graphic);
-                entity.destroy();
-            }
-        }
+        this.layerEntity.removeOverlay(entity.graphic);
+        entity.destroy();
+      }
+    }
 
-        clearEntity() {
-            this.children = [];
-            this.layerEntity.clearOverlays();
-        }
+    clearEntity() {
+      this.children = [];
+      this.layerEntity.clearOverlays();
+    }
 
-        destroy() {
-            this.clearEntity();
-            hnMap.map.map.remove(this.layerEntity);
-            hnMap.map.layerList = hnMap.map.layerList.filter(
-                (v: any) => v.id !== this.id
-            );
-        }
+    destroy() {
+      this.clearEntity();
+      hnMap.map.map.remove(this.layerEntity);
+      hnMap.map.layerList = hnMap.map.layerList.filter(
+        (v: any) => v.id !== this.id
+      );
+    }
 
-        // 添加属性弹窗
-        addPopupByAttr() {
-            if (!this.propsInfoWindow) {
-                this.propsInfoWindow = new AMap.InfoWindow({
-                    offset: new AMap.Pixel(0, -30),
-                });
-            }
-            const handleClick = (e: any) => {
-                const overlay = e.target; // 获取被点击的具体覆盖物
-                const data = overlay.getOptions().extData.data;
-                let content = "";
-                for (const key in data) {
-                    content += `<div>${key}: ${data[key]}</div>`;
-                }
-                this.propsInfoWindow.setContent(content);
-                this.propsInfoWindow.open(hnMap.map.map, e.lnglat);
-            };
-
-            this.layerEntity.off("click", handleClick);
-            this.layerEntity.on("click", handleClick);
-        }
+    // 添加属性弹窗
+    addPopupByAttr() {
+      if (!this.propsInfoWindow) {
+        this.propsInfoWindow = new AMap.InfoWindow({
+          offset: new AMap.Pixel(0, -30),
+        });
+      }
+      const handleClick = (e: any) => {
+        const overlay = e.target; // 获取被点击的具体覆盖物
+        const data = overlay.getOptions().extData.data;
+        let content = "";
+        for (const key in data) {
+          content += `<div>${key}: ${data[key]}</div>`;
+        }
+        this.propsInfoWindow.setContent(content);
+        this.propsInfoWindow.open(hnMap.map.map, e.lnglat);
+      };
+
+      this.layerEntity.off("click", handleClick);
+      this.layerEntity.on("click", handleClick);
+    }
 
-        // 添加自定义dom弹窗
-        addCustomPopup(getCustomDom: any) {
-            if (!this.customInfoWindow) {
-                this.customInfoWindow = new AMap.InfoWindow({
-                    offset: new AMap.Pixel(0, -30),
-                });
-            }
-            if (getCustomDom) {
-                this.getCustomDom = getCustomDom;
-            }
-            const handleClick = (e: any) => {
-                const overlay = e.target; // 获取被点击的具体覆盖物
-                const data = overlay.getOptions().extData.data;
-                const dom = this.getCustomDom(data);
-                this.customInfoWindow.setContent(dom);
-                this.customInfoWindow.open(hnMap.map.map, e.lnglat);
-            };
-            this.layerEntity.off("click", handleClick);
-            this.layerEntity.on("click", handleClick);
-        }
+    // 添加自定义dom弹窗
+    addCustomPopup(getCustomDom: any) {
+      if (!this.customInfoWindow) {
+        this.customInfoWindow = new AMap.InfoWindow({
+          offset: new AMap.Pixel(0, -30),
+        });
+      }
+      if (getCustomDom) {
+        this.getCustomDom = getCustomDom;
+      }
+      const handleClick = (e: any) => {
+        const overlay = e.target; // 获取被点击的具体覆盖物
+        const data = overlay.getOptions().extData.data;
+        const dom = this.getCustomDom(data);
+        this.customInfoWindow.setContent(dom);
+        this.customInfoWindow.open(hnMap.map.map, e.lnglat);
+      };
+      this.layerEntity.off("click", handleClick);
+      this.layerEntity.on("click", handleClick);
+    }
+  }
+
+  class siji_class {
+    id = null;
+    option: any = JSON.parse(JSON.stringify(defaultOption));
+    config: any = null;
+    children: any = null;
+    hideChildrenMap: any = null;
+    layerEntity: any = null;
+    infoWindow: any = null;
+    entity: any = null;
+
+    constructor(option: any) {
+      this.id = option.id;
+      this.children = [];
+      this.hideChildrenMap = {};
+      deepMerge(this.option, option);
+      this.config = this.formatConfig(this.option);
     }
 
-    class siji_class {
-        id = null;
-        option: any = JSON.parse(JSON.stringify(defaultOption));
-        config: any = null;
-        children: any = null;
-        hideChildrenMap: any = null;
-        layerEntity: any = null;
-        infoWindow: any = null;
-        entity: any = null;
-
-        constructor(option: any) {
-            this.id = option.id;
-            this.children = [];
-            this.hideChildrenMap = {};
-            deepMerge(this.option, option);
-            this.config = this.formatConfig(this.option);
-        }
+    formatConfig(option: any) {
+      return option;
+    }
 
-        formatConfig(option: any) {
-            return option;
-        }
+    updateEntity(entity: any, viewPos: any) {
+      const isUpdateEntity =
+        hnMap.map.level >= Number(entity.option.distanceDisplayCondition_far) &&
+        hnMap.map.level <= Number(entity.option.distanceDisplayCondition_near);
+      if (isUpdateEntity) {
+        if (
+          !entity.show &&
+          this.isIncludesLabel(entity.option.position, viewPos)
+        ) {
+          this.addLevelEntity(entity);
+        }
+      } else {
+        if (entity.show) {
+          this.removeLevelEntity(entity);
+        }
+      }
+    }
 
-        updateEntity(entity: any, viewPos: any) {
-            const isUpdateEntity = hnMap.map.level >= Number(entity.option.distanceDisplayCondition_far) && hnMap.map.level <= Number(entity.option.distanceDisplayCondition_near)
-            if (isUpdateEntity) {
-                if (!entity.show && this.isIncludesLabel(entity.option.position, viewPos)) {
-                    this.addLevelEntity(entity);
-                }
-            } else {
-                if (entity.show) {
-                    this.removeLevelEntity(entity);
-                }
-            }
-        }
+    // 判断坐标是否在视口范围内
+    isIncludesLabel(p: any, viewPos: any) {
+      return (
+        p[0] > viewPos.xmin &&
+        p[0] < viewPos.xmax &&
+        p[1] > viewPos.ymin &&
+        p[1] < viewPos.ymax
+      );
+    }
 
-        // 判断坐标是否在视口范围内
-        isIncludesLabel(p: any, viewPos: any) {
-            return p[0] > viewPos.xmin && p[0] < viewPos.xmax && p[1] > viewPos.ymin && p[1] < viewPos.ymax
-        }
+    getEntity(id: any) {
+      return this.children.find((v: any) => v.id === id);
+    }
 
-        getEntity(id: any) {
-            return this.children.find((v: any) => v.id === id);
-        }
+    addEntity(entity: any) {
+      if (this.children.find((v: any) => v.id === entity.id)) {
+        console.error("已存在同名图形" + entity.id);
+      } else {
+        this.children.push(entity);
+        const isUpdateEntity =
+          hnMap.map.level >=
+            Number(entity.option.distanceDisplayCondition_far) &&
+          hnMap.map.level <=
+            Number(entity.option.distanceDisplayCondition_near);
+        if (!entity.option.distanceDisplayCondition || isUpdateEntity) {
+          this.addLevelEntity(entity);
+        }
+      }
+    }
 
-        addEntity(entity: any) {
-            if (this.children.find((v: any) => v.id === entity.id)) {
-                console.error("已存在同名图形" + entity.id);
-            } else {
-                this.children.push(entity);
-                const isUpdateEntity = hnMap.map.level >= Number(entity.option.distanceDisplayCondition_far) && hnMap.map.level <= Number(entity.option.distanceDisplayCondition_near)
-                if (!entity.option.distanceDisplayCondition || isUpdateEntity) {
-                    this.addLevelEntity(entity)
-                }
-            }
-        }
+    removeEntity(entityParam: any) {
+      const entity = this.getEntity(entityParam);
+      if (entity) {
+        this.children = this.children.filter((v: any) => {
+          return v.id !== entity.id;
+        });
+        this.removeLevelEntity(entity);
+      }
+    }
 
-        removeEntity(entityParam: any) {
-            const entity = this.getEntity(entityParam);
-            if (entity) {
-                this.children = this.children.filter((v: any) => {
-                    return v.id !== entity.id;
-                });
-                this.removeLevelEntity(entity)
-            }
-        }
+    addLevelEntity(entity: any) {
+      if (entity.type == "imagePoint") {
+        hnMap.map.map.loadImage(
+          entity.option.image,
+          function (error: any, image: any) {
+            entity.config.layout["icon-size"] =
+              entity.option.width / image.width;
+            hnMap.map.map.addImage(entity.id + "_image", image);
+            hnMap.map.map.addLayer(entity.config);
+          }
+        );
+      } else if (entity.type == "numPoint") {
+        hnMap.map.map.addLayer(entity.config);
+        hnMap.map.map.addLayer(entity.configLabel);
+      } else if (entity.type == "divPoint") {
+        entity.graphic.setLngLat(entity.option.position).addTo(hnMap.map.map);
+      } else if (entity.type == "circle") {
+        let featureArr = {
+          type: "Feature",
+          properties: {
+            centerPoint: entity.option.position,
+            radius: entity.option.radius,
+          },
+          geometry: {
+            type: "Polygon",
+            coordinates: [],
+          },
+        };
+        entity.graphic.addFeature(featureArr);
+        // entity.graphic = new SGMap.DrawCircleHandler(entity.config);
+      } else if (entity.type == "route") {
+        hnMap.map.map.addLayer(entity.config_routeline);
+        hnMap.map.map.addLayer(entity.config_routeplay);
+        entity.createCar();
+        entity.chunkData = entity.joinLinePoint();
+        entity.start();
+      } else {
+        hnMap.map.map.addLayer(entity.config);
+      }
+
+      entity.show = true;
+    }
 
-        addLevelEntity(entity: any) {
-            if (entity.type == "imagePoint") {
-                hnMap.map.map.loadImage(
-                    entity.option.image,
-                    function (error: any, image: any) {
-                        hnMap.map.map.addImage(entity.id + "_image", image);
-                        hnMap.map.map.addLayer(entity.config);
-                    }
-                );
-            } else if (entity.type == "numPoint") {
-                hnMap.map.map.addLayer(entity.config);
-                hnMap.map.map.addLayer(entity.configLabel);
-            } else if (entity.type == "divPoint") {
-                entity.graphic.setLngLat(entity.option.position).addTo(hnMap.map.map);
-            } else if (entity.type == "circle") {
-                let featureArr = {
-                    type: "Feature",
-                    properties: {
-                        centerPoint: entity.option.position,
-                        radius: entity.option.radius,
-                    },
-                    geometry: {
-                        type: "Polygon",
-                        coordinates: [],
-                    },
-                };
-                entity.graphic.addFeature(featureArr);
-                // entity.graphic = new SGMap.DrawCircleHandler(entity.config);
-            } else if (entity.type == "route") {
-                hnMap.map.map.addLayer(entity.config_routeline);
-                hnMap.map.map.addLayer(entity.config_routeplay);
-                entity.createCar();
-                entity.chunkData = entity.joinLinePoint();
-                entity.start();
-            } else {
-
-                hnMap.map.map.addLayer(entity.config);
-            }
-
-            entity.show = true;
-        }
+    removeLevelEntity(entity: any) {
+      if (entity) {
+        if (entity.type == "circle") {
+          entity.graphic.remove();
+          entity.graphic.clearData();
+        } else if (entity.type == "numPoint") {
+          hnMap.map.map.removeLayer(entity.config.id);
+          hnMap.map.map.removeSource(entity.config.id);
+          hnMap.map.map.removeLayer(entity.configLabel.id);
+          hnMap.map.map.removeSource(entity.configLabel.id);
+        } else if (entity.type == "divPoint") {
+          entity.graphic.remove();
+        } else if (entity.type == "route") {
+          hnMap.map.map.removeLayer(entity.config_routeline.id);
+          hnMap.map.map.removeSource(entity.config_routeline.id);
+          hnMap.map.map.removeLayer(entity.config_routeplay.id);
+          hnMap.map.map.removeSource(entity.config_routeplay.id);
+          entity.imgMarker.remove();
+        } else {
+          hnMap.map.map.removeLayer(entity.id);
+          hnMap.map.map.removeSource(entity.id);
+        }
+        entity.show = false;
+      }
+    }
 
-        removeLevelEntity(entity: any) {
-
-            if (entity) {
-                if (entity.type == "circle") {
-                    entity.graphic.remove();
-                    entity.graphic.clearData();
-                } else if (entity.type == "numPoint") {
-                    hnMap.map.map.removeLayer(entity.config.id);
-                    hnMap.map.map.removeSource(entity.config.id);
-                    hnMap.map.map.removeLayer(entity.configLabel.id);
-                    hnMap.map.map.removeSource(entity.configLabel.id);
-                } else if (entity.type == "divPoint") {
-                    entity.graphic.remove();
-                } else if (entity.type == "route") {
-                    hnMap.map.map.removeLayer(entity.config_routeline.id);
-                    hnMap.map.map.removeSource(entity.config_routeline.id);
-                    hnMap.map.map.removeLayer(entity.config_routeplay.id);
-                    hnMap.map.map.removeSource(entity.config_routeplay.id);
-                    entity.imgMarker.remove();
-                } else {
-                    hnMap.map.map.removeLayer(entity.id);
-                    hnMap.map.map.removeSource(entity.id);
-                }
-                entity.show = false;
-            }
-        }
+    clearEntity() {
+      this.children.forEach((v: any) => {
+        this.removeEntity(v.id);
+      });
+      this.children = [];
+    }
 
-        clearEntity() {
-            this.children.forEach((v: any) => {
-                this.removeEntity(v.id)
-            });
-            this.children = [];
-        }
+    destroy() {
+      this.clearEntity();
+      hnMap.map.layerList = hnMap.map.layerList.filter(
+        (v: any) => v.id !== this.id
+      );
+    }
 
-        destroy() {
-            this.clearEntity();
-            hnMap.map.layerList = hnMap.map.layerList.filter(
-                (v: any) => v.id !== this.id
-            );
-        }
+    // 添加属性弹窗
+    addPopupByAttr() {
+      // 如果已有弹窗，先关闭
+      this.removePopup();
+      this.infoWindow = new SGMap.Popup({
+        offset: { bottom: [0, 0] },
+        className: "my-attrPopup-class",
+      });
 
-        // 添加属性弹窗
-        addPopupByAttr() {
-            // 如果已有弹窗，先关闭
-            this.removePopup();
-            this.infoWindow = new SGMap.Popup({
-                offset: {bottom: [0, 0]},
-                className: "my-attrPopup-class",
-            });
-
-            const handleClick = (e: any) => {
-                let data = e.features[0].properties;
-
-                // 创建弹窗内容
-                let content = "";
-                for (const key in data) {
-                    content += `<div>${key}: ${data[key]}</div>`;
-                }
-
-                this.infoWindow.setHTML(content);
-                console.log("e.lngLat===", e.lngLat);
-                this.infoWindow.setLngLat(e.lngLat).addTo(hnMap.map.map);
-            };
-
-            hnMap.map.map.on("click", this.config.id, handleClick);
-        }
+      const handleClick = (e: any) => {
+        let data = e.features[0].properties;
 
-        // 添加自定义dom弹窗
-        addCustomPopup(getCustomDom: any) {
-            // 如果已有弹窗，先关闭
-            this.removePopup();
-            this.infoWindow = new SGMap.Popup({
-                offset: {bottom: [0, 0]},
-                className: "my-customPopup-class",
-            });
-
-            const handleClick = (e: any) => {
-                const data = e.features[0].properties;
-                const dom = getCustomDom(data);
-                this.infoWindow.setHTML(dom);
-                this.infoWindow.setLngLat(e.lngLat).addTo(hnMap.map.map);
-            };
-
-            hnMap.map.map.on("click", this.config.id, handleClick);
+        // 创建弹窗内容
+        let content = "";
+        for (const key in data) {
+          content += `<div>${key}: ${data[key]}</div>`;
         }
 
-        // 弹窗删除
-        removePopup() {
-            if (this.infoWindow) {
-                this.infoWindow.remove();
-            }
-        }
+        this.infoWindow.setHTML(content);
+        console.log("e.lngLat===", e.lngLat);
+        this.infoWindow.setLngLat(e.lngLat).addTo(hnMap.map.map);
+      };
+
+      hnMap.map.map.on("click", this.config.id, handleClick);
+    }
+
+    // 添加自定义dom弹窗
+    addCustomPopup(getCustomDom: any) {
+      // 如果已有弹窗，先关闭
+      this.removePopup();
+      this.infoWindow = new SGMap.Popup({
+        offset: { bottom: [0, 0] },
+        className: "my-customPopup-class",
+      });
+
+      const handleClick = (e: any) => {
+        const data = e.features[0].properties;
+        const dom = getCustomDom(data);
+        this.infoWindow.setHTML(dom);
+        this.infoWindow.setLngLat(e.lngLat).addTo(hnMap.map.map);
+      };
+
+      hnMap.map.map.on("click", this.config.id, handleClick);
+    }
+
+    // 弹窗删除
+    removePopup() {
+      if (this.infoWindow) {
+        this.infoWindow.remove();
+      }
     }
+  }
 
-    const fn: any = {
-        mars3d: mars3d_class,
-        gaode: gaode_class,
-        siji: siji_class,
-    };
+  const fn: any = {
+    mars3d: mars3d_class,
+    gaode: gaode_class,
+    siji: siji_class,
+  };
 
-    return fn[hnMap.mapType];
+  return fn[hnMap.mapType];
 };