地图

wujingjing

2025-01-17 055c8329a8e8f7bc50bb1f10711031ea0bccaf2f

 src/model/map/OLMap.ts

@@ -123,14 +123,14 @@
      const markers: Overlay[] = [];

      // 创建标记点
      dataList.forEach((item) => {
         const marker = this.createMarker(item, markerOpt);
      dataList.forEach((item, index) => {
         const marker = this.createMarker(`marker-${index}`, item, markerOpt);
         markers.push(marker);
         this.map.addOverlay(marker);
      });

      // 计算并调整视图范围
      this.adjustViewToMarkers(dataList);
      this.adjustViewToOverlays(markers);
   }

   createEleOverlay(dom: string | HTMLElement, position = [0, 0]) {
@@ -148,7 +148,8 @@
      return eleOverlay;
   }

   private createMarker(item: any, markerOpt: any): Overlay {
	
   private createMarker(id: string, item: any, markerOpt: any): Overlay {
      // 创建图片元素
      const markerImg = document.createElement('img');
      markerImg.src = markerOpt.icon.url;
@@ -161,6 +162,7 @@

      // 创建 Overlay
      const overlay = new MarkerOverlay({
         id,
         className: MARKER_OVERLAY_CLASS_NAME,
         element: markerImg,
         position: position,
@@ -174,23 +176,22 @@
         if (markerOpt.icon.selectUrl) {
            markerImg.src = markerOpt.icon.selectUrl;
         }
         markerOpt.click?.(event, overlay, item, position);
         markerOpt.click?.(event, overlay, item.extData, position);
      });

      return overlay;
   }

   private adjustViewToMarkers(dataList: any[]) {
      // 计算所有点的范围
      const extent = dataList.reduce((ext, item) => {
         const coord = fromLonLat(item.position);
    adjustViewToOverlays(overlays: Overlay[]) {
      const extent = overlays.reduce<number[] | null>((ext, item) => {
         const coord = item.getPosition();

         if (!ext) {
            return [coord[0], coord[1], coord[0], coord[1]];
         }
         return [Math.min(ext[0], coord[0]), Math.min(ext[1], coord[1]), Math.max(ext[2], coord[0]), Math.max(ext[3], coord[1])];
      }, null);

      // 调整视图以适应标记点范围
      if (extent) {
         this.fitExtend(extent);
      }
@@ -221,7 +222,10 @@
      const overlays = this.map.getOverlays();
      overlays.forEach((overlay) => {
         if (overlay instanceof MarkerOverlay) {
            overlay.setVisible(visible);
            const overlayElement = overlay.getElement();
            if (overlayElement) {
               overlayElement.style.visibility = visible ? 'visible' : 'hidden';
            }
         }
      });
      this.overlayIsVisible.value = visible;