From baf0200b0b9968bc5e314bcde08490f33ea9cb29 Mon Sep 17 00:00:00 2001
From: zhufu <17863654727@163.com>
Date: Thu, 6 Nov 2025 10:41:31 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B9=E4=BD=8D=E8=A7=92=E5=AF=B9=E5=BA=94?=
 =?UTF-8?q?=E4=B8=8D=E4=B8=8A=E9=97=AE=E9=A2=98=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/MapboxMaps/MapComponent.vue | 46 +++++++++++++---------
 1 file changed, 28 insertions(+), 18 deletions(-)

diff --git a/src/components/MapboxMaps/MapComponent.vue b/src/components/MapboxMaps/MapComponent.vue
index 81663d8..945be5f 100644
--- a/src/components/MapboxMaps/MapComponent.vue
+++ b/src/components/MapboxMaps/MapComponent.vue
@@ -2150,49 +2150,59 @@
         childElement.style.backgroundSize = '43px 57px';
         childElement.style.position = "relative";
         arrowElement.appendChild(childElement);
-        pictureArrowElementArray.value?.push(childElement);
-        pictureParentArrowElementArray.value?.push(arrowElement);
-        let arrowMark = new mapboxgl.Marker(arrowElement)
-          .setLngLat([item.lng, item.lat])
-          .addTo(map);
+        
+        let childElementObj = {
+          id:item.id,
+          element:childElement
+        }
+        pictureArrowElementArray.value?.push(childElementObj);
+
+        let arrowElementObj = {
+          id:item.id,
+          element:arrowElement
+        }
+        pictureParentArrowElementArray.value?.push(arrowElementObj);
+        
+        let arrowMark = new mapboxgl.Marker(arrowElement).setLngLat([item.lng, item.lat]).addTo(map);
         pictureArrowMarker.value?.push(arrowMark);
       }
     });
 
     currentPictureZIndex.value = list?.length;
-
     // setTimeout(function(){
     //   handlerCurrentImageChange(0);
     // },10000)
   }
 
-  function handlerCurrentImageChange(fileName) {
+function handlerCurrentImageChange(fileName) {
     // 根据图片名检索标签
     let currentIndex = null;
+    let currentId = null;
     imageList.value?.forEach((item, index) => {
       if (item.filePath?.match(fileName)) {
         currentIndex = index;
+        currentId = item.id;
         currentPictureIndex.value = index;
       }
     });
     try {
       pictureArrowElementArray.value?.forEach((itme, index) => {
-        pictureArrowElementArray.value[index].style.backgroundImage = 'url(/map/arrow.png)';
+        pictureArrowElementArray.value[index]['element'].style.backgroundImage = 'url(/map/arrow.png)';
         if(isShowPicture.value){
-          pictureArrowElementArray.value[index].style.display = 'block';
+          pictureArrowElementArray.value[index]['element'].style.display = 'block';
         }else{
-          pictureArrowElementArray.value[index].style.display = 'none';
+          pictureArrowElementArray.value[index]['element'].style.display = 'none';
+        }
+        if(itme.id == currentId){
+          pictureArrowElementArray.value[index]['element'].style.backgroundImage = 'url(/map/arrow-a.png)';
+          pictureArrowElementArray.value[index]['element'].style.display = 'block';
+
+          // 设置显示在最上层
+          currentPictureZIndex.value = currentPictureZIndex.value + 1;
+          pictureParentArrowElementArray.value[index]['element'].style.zIndex = currentPictureZIndex.value;
         }
       });
-
-      pictureArrowElementArray.value[currentIndex].style.backgroundImage = 'url(/map/arrow-a.png)';
-      pictureArrowElementArray.value[currentIndex].style.display = 'block';
-
-      // 设置显示在最上层
-      currentPictureZIndex.value = currentPictureZIndex.value + 1;
-      pictureParentArrowElementArray.value[currentIndex].style.zIndex = currentPictureZIndex.value;
     } catch (e) {}
-
     return;
   }