的JavaScript /谷歌地圖 - 無法刪除標記

Question

我想從地圖上刪除特定的標記，對於這一點，我已經寫了下面

<button (click)="removeDriver(id)"></button> 


    removeDriver(userId) { 
     //remove from the array a particular user 
    this.places = this.places.filter((user) => { 
     return user.userId !== userId; 
    }); 

    let currentDriverLocation; 
    //the array elements are updated now, and the markers should be plotted again 
    this.places.forEach((driver) => { 
     currentDriverLocation = new google.maps.LatLng(driver.currentLocation.lat, driver.currentLocation.long); 
      this.marker = new google.maps.Marker({ position: currentDriverLocation, map: this.map }); 
    }) 
    } 

數組與新對象更新;但是，沒有標記被刪除。

this.places排列如下所示：

[{"userId":"khfdg999","currentLocation":{"lat":59.02922, "lng":-12.3932}}, 

    {"userId":"a85jfdo","currentLocation":{"lat":59.02922, "lng":-12.3932}}] 

Answer 1

在你的情況，你是複製現有的標記（除了一個被刪除）。

要從地圖移除標記，你必須調用：

marker.setMap(null); 

對於這一點，你需要保持在您創建的每個標記及其相關的「用戶id」的參考。它可能是這樣的：

removeDriver(userId) { 
    //remove from the array a particular user 
    this.places = this.places.filter((user) => { 
    return user.userId !== userId; 
    }); 
    //remove from the markers a particular user 
    if (this.markers[userId]) { 
    this.markers[userId].setMap(null); 
    this.markers[userId] = null; 
    }; 
} 

addDriver(lat, lng, userId) { 
    this.places.push({ 
     userId: userId, 
     currentLocation: {lat: lat, long: lng} 
    }); 
    this.markers[userId] = new google.maps.Marker({ 
     position: new google.maps.LatLng(lat, lng), 
     map: this.map 
    }); 
} 

而你只加載驅動程序後調用displayMarkers。