如何切換標記？

Question

我的代碼，以使標記：

for (var marker in markers) { 
    var posMarker = new google.maps.Marker({ 
     position: new google.maps.LatLng(markers[marker].lat, markers[marker].lng), 
     map: map, 
     visible: markers[marker].visible 
    });  
}; 

我的標記對象：

var markers = { 
     "London": {"lat": -83.68088192646843, "lng": -125.270751953125, "type": "town", "visible": false}, 
     "Paris": {"lat": -58.1548020417031, "lng": -21.318115234375, "type": "town", "visible": false}, 
}; 

我想能有一個複選框切換標記，像這樣：

$('#toggle').change(function() { 
    for (var marker in markers) { 
     posMarker.setVisible(true); 
    }; 
}); 

但只顯示陣列中的最後一個標記，我如何讓它們全部出現？

謝謝。

Answer 1

嗯，我看到posMarker被用作放置Google地圖標記的臨時變量，隨着for循環的進展，posMarker引用「更新」到放置的最新標記。這就是爲什麼只顯示最後一個標記。

您需要跟蹤所有對Google地圖標記的引用，包括那些已被「消耗」的引用。我的方法使用了一個對象，就像您的對象markers一樣，但保留對Google地圖標記的引用。你也可以使用普通的索引數組（posMarkers []）。隨你便。

請參閱Demo，注意LatLngs爲簡單起見進行了修改（看起來像您有一個自定義座標系）。

另外，我沒有做這種改變，但我只注意到它可能更有意義來調用markers ，city在markers，因爲你的目標是編寫方式。它會更具可讀性，但不會影響執行。

最後，在for loops塊末尾的分號是不需要的，並且要注意Paris對象後面的尾隨逗號（我猜你剛剛刪除了其餘的列表）。在這種情況下，這並不重要，但其他時候，這些尾隨逗號可能是難以發現的錯誤的來源。

function initialize() { 
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
    var markers = { 
     "London": {"lat": 0, "lng": 0, "type": "town", "visible": false}, 
     "Paris": {"lat": 10, "lng": 10, "type": "town", "visible": false} 
    }; 

    var posMarkers = {}; 

    for (var marker in markers) { 
     posMarkers[marker] = new google.maps.Marker({ 
     position: new google.maps.LatLng(markers[marker].lat, markers[marker].lng), 
     map: map, 
     visible: markers[marker].visible 
     });  
    } 

    $('#toggle').change(function() { 
     for (var marker in markers) { 
     if(posMarkers[marker].getVisible()) { 
      posMarkers[marker].setVisible(false); 
     } 
     else { 
      posMarkers[marker].setVisible(true); 
     } 
     } 
    }); 
    }