hn-map 1.1.14 → 1.1.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hn-map",
-  "version": "1.1.14",
+  "version": "1.1.16",
   "description": "hn-map集成mars3d、高德、思极",
   "main": "dist/index.js",
   "author": "庞大仙",

package/src/base/gaode_entity.ts

@@ -1,61 +1,83 @@
-export default class gaode_entity {
-    infoWindow: any = null
-    hnMap: any = null
-    config: any = null
-    graphic: any = null
+/**
+ * 高德地图实体基类
+ * 提供高德地图要素的通用功能，如弹窗管理、飞行定位、要素销毁等
+ */
+export default class GaodeEntity {
+    /** 信息窗口实例 */
+    private infoWindow: any = null;
+    /** 地图实例 */
+    protected hnMap: any = null;
+    /** 配置对象 */
+    protected config: any = null;
+    /** 图形实例 */
+    protected graphic: any = null;
 
+    /**
+     * 构造函数
+     * @param hnMap 地图实例
+     */
     constructor(hnMap: any) {
-        this.hnMap = hnMap
+        this.hnMap = hnMap;
     }
 
-    // 添加属性弹窗
-    addPopupByAttr() {
+    /**
+     * 添加属性弹窗
+     * 点击要素时显示包含要素属性信息的弹窗
+     */
+    addPopupByAttr(): void {
         this.infoWindow = new AMap.InfoWindow({offset: new AMap.Pixel(0, -30)});
 
         const handleClick = (e: any) => {
-            const data = this.config.extData.data
-            let content = ''
+            const data = this.config.extData.data;
+            let content = '';
             for (const key in data) {
-                content += `<div>${key}: ${data[key]}</div>`
+                content += `<div>${key}: ${data[key]}</div>`;
             }
             this.infoWindow.setContent(content);
             this.infoWindow.open(this.hnMap.map.map, e.lnglat);
-        }
+        };
 
-        this.graphic.on('click', handleClick)
+        this.graphic.on('click', handleClick);
     }
 
-    // 添加自定义dom弹窗
-    addCustomPopup(getCustomDom: any) {
+    /**
+     * 添加自定义DOM弹窗
+     * 点击要素时显示自定义DOM结构的弹窗
+     * @param getCustomDom 自定义DOM生成函数，接收要素数据，返回DOM字符串
+     */
+    addCustomPopup(getCustomDom: (data: any) => string): void {
         this.infoWindow = new AMap.InfoWindow({offset: new AMap.Pixel(0, -30)});
 
-        const handleClick = (e:any ) => {
-            const data = this.config.extData.data
-            const dom = getCustomDom(data)
+        const handleClick = (e: any) => {
+            const data = this.config.extData.data;
+            const dom = getCustomDom(data);
             this.infoWindow.setContent(dom);
             this.infoWindow.open(this.hnMap.map.map, e.lnglat);
-        }
+        };
 
-        this.graphic.on('click', handleClick)
+        this.graphic.on('click', handleClick);
     }
 
-    flyTo() {
-
+    /**
+     * 飞行定位到要素
+     * 根据要素类型自动选择合适的定位方式
+     */
+    flyTo(): void {
         if (this.graphic.getCenter) {
             this.hnMap.map.map.setCenter(this.graphic.getCenter());
-        }
-
-        if (this.graphic.getPosition) {
+        } else if (this.graphic.getPosition) {
             this.hnMap.map.map.setCenter(this.graphic.getPosition());
-        }
-
-        if (this.graphic.getBounds) {
+        } else if (this.graphic.getBounds) {
             const bounds = this.graphic.getBounds();
             this.hnMap.map.map.setBounds(bounds);
         }
     }
 
-    destroy() {
-        this.graphic.remove()
+    /**
+     * 销毁要素
+     * 从地图中移除要素
+     */
+    destroy(): void {
+        this.graphic.remove();
     }
 }

package/src/base/mars3d_entity.ts

@@ -1,16 +1,28 @@
-import {getMapRangeHeightByLevel} from "../util";
-
-export default class mars3d_entity {
-    option: any = null;
-    event: any = {};
-    graphic: any = null;
+/**
+ * mars3d地图实体基类
+ * 提供mars3d地图要素的通用功能，如弹窗管理、事件处理、飞行定位等
+ */
+export default class Mars3dEntity {
+    /** 配置选项 */
+    protected option: any = null;
+    /** 事件监听器集合 */
+    private event: Record<string, Function> = {};
+    /** 图形实例 */
+    protected graphic: any = null;
 
+    /**
+     * 构造函数
+     * @param hnMap 地图实例
+     */
     constructor(hnMap: any) {
         this.event = {};
     }
 
-    // 添加属性弹窗
-    addPopupByAttr() {
+    /**
+     * 添加属性弹窗
+     * 点击要素时显示包含要素属性信息的弹窗
+     */
+    addPopupByAttr(): void {
         this.graphic.bindPopup((event: any) => {
             const data = event.graphic.attr;
             return mars3d.Util.getTemplateHtml({
@@ -21,8 +33,12 @@ export default class mars3d_entity {
         });
     }
 
-    // 添加自定义dom弹窗
-    addCustomPopup(getCustomDom: any) {
+    /**
+     * 添加自定义DOM弹窗
+     * 点击要素时显示自定义DOM结构的弹窗
+     * @param getCustomDom 自定义DOM生成函数，接收要素数据，返回DOM字符串
+     */
+    addCustomPopup(getCustomDom: (data: any) => Promise<string> | string): void {
         this.graphic.bindPopup(
             async (event: any) => {
                 if (event.graphic.attr) {
@@ -34,16 +50,30 @@ export default class mars3d_entity {
         );
     }
 
-    flyTo(option = {}) {
+    /**
+     * 飞行定位到要素
+     * @param option 飞行定位选项
+     */
+    flyTo(option: any = {}): void {
         this.graphic.flyTo(option);
     }
 
-    destroy() {
+    /**
+     * 销毁要素
+     * 从地图中移除并销毁要素
+     */
+    destroy(): void {
         this.graphic.destroy();
     }
 
-    on(eventType: any, callback: any) {
+    /**
+     * 监听事件
+     * @param eventType 事件类型
+     * @param callback 事件回调函数
+     */
+    on(eventType: string, callback: (data: any) => void): void {
         this.off(eventType);
+        
         switch (eventType) {
             case "click":
                 this.event[eventType] = () => {
@@ -51,10 +81,15 @@ export default class mars3d_entity {
                 };
                 break;
         }
+        
         this.graphic.on(eventType, this.event[eventType]);
-    } // 监听事件
+    }
 
-    off(eventType: any) {
+    /**
+     * 移除事件监听
+     * @param eventType 事件类型
+     */
+    off(eventType: string): void {
         if (this.event[eventType]) {
             this.graphic.off(eventType, this.event[eventType]);
             delete this.event[eventType];

package/src/base/siji_entity.ts

@@ -1,24 +1,44 @@
 import {deepMerge} from "../util";
 
-export default class siji_entity {
-    event: any = {};
-    infoWindow: any = null;
-    hnMap: any = null;
-    config: any = null;
-    graphic: any = null;
-    option: any = null;
-    type: any = null;
-    show: boolean = false;
-    id: any = null
-
+/**
+ * 思极地图实体基类
+ * 提供思极地图要素的通用功能，如弹窗管理、事件处理、飞行定位等
+ */
+export default class SijiEntity {
+    /** 事件监听器集合 */
+    private event: Record<string, Function> = {};
+    /** 信息窗口实例 */
+    private infoWindow: any = null;
+    /** 地图实例 */
+    protected hnMap: any = null;
+    /** 配置对象 */
+    protected config: any = null;
+    /** 图形实例 */
+    protected graphic: any = null;
+    /** 配置选项 */
+    protected option: any = null;
+    /** 要素类型 */
+    protected type: string | null = null;
+    /** 是否显示 */
+    protected show: boolean = false;
+    /** 要素ID */
+    protected id: string | null = null;
+
+    /**
+     * 构造函数
+     * @param hnMap 地图实例
+     */
     constructor(hnMap: any) {
         this.hnMap = hnMap;
         this.event = {};
         this.show = false;
     }
 
-    // 添加属性弹窗
-    addPopupByAttr() {
+    /**
+     * 添加属性弹窗
+     * 点击要素时显示包含要素属性信息的弹窗
+     */
+    addPopupByAttr(): void {
         // 如果已有弹窗，先关闭
         this.removePopup();
 
@@ -28,12 +48,10 @@ export default class siji_entity {
         });
 
         const handleClick = (e: any) => {
-
             const features = this.hnMap.map.map.queryRenderedFeatures(e.point);
             if (features.length > 0) {
-                // 当前点击的第一层图形为当前图形时，才满足点击事件
+                // 当前点击的第一层图形为当前图形时，才触发点击事件
                 if (features[0].layer.id === this.id) {
-                    // const data = e.features[0].properties;
                     const data = this.option.data;
                     // 创建弹窗内容
                     let content = "";
@@ -44,15 +62,18 @@ export default class siji_entity {
                     this.infoWindow.setHTML(content);
                     this.infoWindow.setLngLat(e.lngLat).addTo(this.hnMap.map.map);
                 }
-
             }
         };
 
         this.hnMap.map.map.on("click", this.id, handleClick);
     }
 
-    // 添加自定义dom弹窗
-    addCustomPopup(getCustomDom: any) {
+    /**
+     * 添加自定义DOM弹窗
+     * 点击要素时显示自定义DOM结构的弹窗
+     * @param getCustomDom 自定义DOM生成函数，接收要素数据，返回DOM字符串
+     */
+    addCustomPopup(getCustomDom: (data: any) => string): void {
         this.removePopup();
         this.infoWindow = new SGMap.Popup({
             offset: {bottom: [0, 0]},
@@ -62,10 +83,9 @@ export default class siji_entity {
         const handleClick = (e: any) => {
             const features = this.hnMap.map.map.queryRenderedFeatures(e.point);
             if (features.length > 0) {
-                // 当前点击的第一层图形为当前图形时，才满足点击事件
+                // 当前点击的第一层图形为当前图形时，才触发点击事件
                 if (features[0].layer.id === this.id) {
                     const data = this.option.data;
-                    // const data = e.features[0].properties;
                     const dom = getCustomDom(data);
                     this.infoWindow.setHTML(dom);
                     this.infoWindow.setLngLat(e.lngLat).addTo(this.hnMap.map.map);
@@ -76,58 +96,70 @@ export default class siji_entity {
         this.hnMap.map.map.on("click", this.id, handleClick);
     }
 
-    // 弹窗删除
-    removePopup() {
+    /**
+     * 删除弹窗
+     */
+    removePopup(): void {
         if (this.infoWindow) {
             this.infoWindow.remove();
         }
     }
 
-    flyTo(option: any = {}) {
+    /**
+     * 飞行定位到要素
+     * @param option 飞行定位选项
+     */
+    flyTo(option: any = {}): void {
         deepMerge(this.option, option);
-        let zoom = this.hnMap.map.map.getZoom();
-        let center;
+        const zoom = this.hnMap.map.map.getZoom();
+        let center: [number, number];
+        
         if (this.option.center) {
             center = this.option.center;
         } else {
-            if (
-                this.type == "line" ||
-                this.type == "dash" ||
-                this.type == "flicker" ||
-                this.type == "flow" ||
-                this.type == "arrow" ||
-                this.type == "mapLabel" ||
-                this.type == "rectangle"
-            ) {
+            const type = this.type || "";
+            // 根据要素类型确定中心点
+            if (["line", "dash", "flicker", "flow", "arrow", "mapLabel", "rectangle"].includes(type)) {
                 center = this.option.position[0];
-            } else if (this.type == "route") {
+            } else if (type === "route") {
                 center = [this.option.position[0][0], this.option.position[0][1]];
-            } else if (this.type == "polygon") {
+            } else if (type === "polygon") {
                 center = this.option.position[0][0];
             } else {
                 center = this.option.position;
             }
         }
+        
         this.hnMap.map.map.flyTo({
-            duration: 1000, // 持续时间
+            duration: 1000, // 持续时间（毫秒）
             zoom: this.option.zoom || zoom,
             center: center,
         });
     }
 
-    destroy() {
+    /**
+     * 销毁要素
+     * 从地图中移除图层和数据源
+     */
+    destroy(): void {
         this.hnMap.map.map.removeLayer(this.config.id);
         this.hnMap.map.map.removeSource(this.config.id);
     }
 
-    on(eventType: any, callback: any) {
+    /**
+     * 监听事件
+     * @param eventType 事件类型
+     * @param callback 事件回调函数
+     */
+    on(eventType: string, callback: (data: any) => void): void {
         this.off(eventType);
+        
         switch (eventType) {
             case "click":
-                this.event[eventType] = (e:any) => {
+                this.event[eventType] = (e: any) => {
                     const features = this.hnMap.map.map.queryRenderedFeatures(e.point);
                     if (features.length > 0) {
-                        // 当前点击的第一层图形为当前图形时，才满足点击事件
+                        // 当前点击的第一层图形为当前图形时，才触发回调
                         if (features[0].layer.id === this.id) {
                             callback(this.option.data);
                         }
@@ -135,10 +167,15 @@ export default class siji_entity {
                 };
                 break;
         }
+        
         this.hnMap.map.map.on(eventType, this.id, this.event[eventType]);
-    } // 监听事件
+    }
 
-    off(eventType: any) {
+    /**
+     * 移除事件监听
+     * @param eventType 事件类型
+     */
+    off(eventType: string): void {
         if (this.event[eventType]) {
             this.hnMap.map.map.off(eventType, this.id, this.event[eventType]);
             delete this.event[eventType];

package/src/graphic/circle.ts

@@ -4,9 +4,9 @@ import {
   wgs84ToGcj02Format,
   convertPosition,
 } from "../util";
-import mars3d_entity from "../base/mars3d_entity";
-import gaode_entity from "../base/gaode_entity";
-import siji_entity from "../base/siji_entity";
+import Mars3dEntity from "../base/mars3d_entity";
+import GaodeEntity from "../base/gaode_entity";
+import SijiEntity from "../base/siji_entity";
 
 export default (hnMap: any) => {
   const defaultOption = {
@@ -31,7 +31,7 @@ export default (hnMap: any) => {
     data: null,
   };
 
-  class mars3d_class extends mars3d_entity {
+  class mars3d_class extends Mars3dEntity {
     type: any = "circle";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
@@ -120,7 +120,7 @@ export default (hnMap: any) => {
     // }
   }
 
-  class gaode_class extends gaode_entity {
+  class gaode_class extends GaodeEntity {
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
     config: any = null;
@@ -158,7 +158,7 @@ export default (hnMap: any) => {
       this.graphic.setCenter(this.config.center);
     }
   }
-  class siji_class extends siji_entity {
+  class siji_class extends SijiEntity {
     type: any = "circle";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));

package/src/graphic/divPoint.ts

@@ -4,9 +4,9 @@ import {
   wgs84ToGcj02Format,
   convertPosition,
 } from "../util";
-import mars3d_entity from "../base/mars3d_entity";
-import gaode_entity from "../base/gaode_entity";
-import siji_entity from "../base/siji_entity";
+import Mars3dEntity from "../base/mars3d_entity";
+import GaodeEntity from "../base/gaode_entity";
+import SijiEntity from "../base/siji_entity";
 const HorizontalOrigin: any = {
   center: 0,
   left: 1,
@@ -34,7 +34,7 @@ export default (hnMap: any) => {
     data: null,
   };
 
-  class mars3d_class extends mars3d_entity {
+  class mars3d_class extends Mars3dEntity {
     type: any = "divPoint";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
@@ -85,7 +85,7 @@ export default (hnMap: any) => {
       this.graphic.openPopup();
     }
   }
-  class siji_class extends siji_entity {
+  class siji_class extends SijiEntity {
     type: any = "divPoint";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));

package/src/graphic/imagePoint.ts

@@ -4,9 +4,9 @@ import {
   wgs84ToGcj02Format,
   convertPosition,
 } from "../util";
-import mars3d_entity from "../base/mars3d_entity";
-import gaode_entity from "../base/gaode_entity";
-import siji_entity from "../base/siji_entity";
+import Mars3dEntity from "../base/mars3d_entity";
+import GaodeEntity from "../base/gaode_entity";
+import SijiEntity from "../base/siji_entity";
 
 const HorizontalOrigin: any = {
   center: 0,
@@ -41,7 +41,7 @@ export default (hnMap: any) => {
     data: null,
   };
 
-  class mars3d_class extends mars3d_entity {
+  class mars3d_class extends Mars3dEntity {
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
     config: any = null;
@@ -114,7 +114,7 @@ export default (hnMap: any) => {
     }
   }
 
-  class gaode_class extends gaode_entity {
+  class gaode_class extends GaodeEntity {
     type: any = "imagePoint";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
@@ -154,7 +154,7 @@ export default (hnMap: any) => {
     }
   }
 
-  class siji_class extends siji_entity {
+  class siji_class extends SijiEntity {
     type: any = "imagePoint";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));

package/src/graphic/label.ts

@@ -4,9 +4,9 @@ import {
   wgs84ToGcj02Format,
   convertPosition,
 } from "../util";
-import mars3d_entity from "../base/mars3d_entity";
-import gaode_entity from "../base/gaode_entity";
-import siji_entity from "../base/siji_entity";
+import Mars3dEntity from "../base/mars3d_entity";
+import GaodeEntity from "../base/gaode_entity";
+import SijiEntity from "../base/siji_entity";
 
 export default (hnMap: any) => {
   const defaultOption = {
@@ -33,7 +33,7 @@ export default (hnMap: any) => {
     data: null,
   };
 
-  class mars3d_class extends mars3d_entity {
+  class mars3d_class extends Mars3dEntity {
     type: any = "label";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
@@ -133,7 +133,7 @@ export default (hnMap: any) => {
     }
   }
 
-  class gaode_class extends gaode_entity {
+  class gaode_class extends GaodeEntity {
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
     config: any = null;
@@ -179,7 +179,7 @@ export default (hnMap: any) => {
     }
   }
 
-  class siji_class extends siji_entity {
+  class siji_class extends SijiEntity {
     type: any = "label";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));

package/src/graphic/line.ts

@@ -4,9 +4,9 @@ import {
   wgs84ToGcj02Format,
   convertPosition,
 } from "../util";
-import mars3d_entity from "../base/mars3d_entity";
-import gaode_entity from "../base/gaode_entity";
-import siji_entity from "../base/siji_entity";
+import Mars3dEntity from "../base/mars3d_entity";
+import GaodeEntity from "../base/gaode_entity";
+import SijiEntity from "../base/siji_entity";
 
 export default (hnMap: any) => {
   const defaultOption = {
@@ -33,7 +33,7 @@ export default (hnMap: any) => {
     instances: [],
   };
 
-  class mars3d_class extends mars3d_entity {
+  class mars3d_class extends Mars3dEntity {
     type: any = "line";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
@@ -162,7 +162,7 @@ export default (hnMap: any) => {
     }
   }
 
-  class gaode_class extends gaode_entity {
+  class gaode_class extends GaodeEntity {
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
     config: any = null;
@@ -199,7 +199,7 @@ export default (hnMap: any) => {
       this.graphic.setPath(this.config.path);
     }
   }
-  class siji_class extends siji_entity {
+  class siji_class extends SijiEntity {
     type: any = "line";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));

package/src/graphic/numPoint.ts

@@ -4,9 +4,9 @@ import {
   wgs84ToGcj02Format,
   convertPosition,
 } from "../util";
-import mars3d_entity from "../base/mars3d_entity";
-import gaode_entity from "../base/gaode_entity";
-import siji_entity from "../base/siji_entity";
+import Mars3dEntity from "../base/mars3d_entity";
+import GaodeEntity from "../base/gaode_entity";
+import SijiEntity from "../base/siji_entity";
 export default (hnMap: any) => {
   const defaultOption = {
     id: "",
@@ -24,7 +24,7 @@ export default (hnMap: any) => {
     data: null,
   };
 
-  class mars3d_class extends mars3d_entity {
+  class mars3d_class extends Mars3dEntity {
     type: any = "numPoint";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
@@ -74,7 +74,7 @@ export default (hnMap: any) => {
     }
   }
 
-  class gaode_class extends gaode_entity {
+  class gaode_class extends GaodeEntity {
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));
     config: any = null;
@@ -120,7 +120,7 @@ export default (hnMap: any) => {
     }
   }
 
-  class siji_class extends siji_entity {
+  class siji_class extends SijiEntity {
     type: any = "numPoint";
     id: any = null;
     option: any = JSON.parse(JSON.stringify(defaultOption));