從Google Maps API V3中刪除標記

我有一張地圖，我想通過複選框添加標記（帶有信息窗口）。它也工作得很好，但當我取消選中複選框時，我不能再次刪除它。誰能幫忙？從Google Maps API V3中刪除標記

function clearOverlays() { 
    google.maps.event.clearListeners(marker300, 'click'); 
} 

function showOverlays() { 
    var marker300 = new google.maps.Marker({ 
     position: new google.maps.LatLng(45.0, 1.0), 
     map: map /*, 
     icon: 'img/bike5.png' */ 
    }); 

    var infowindow300 = new google.maps.InfoWindow({ 
     content: '<div style="width: 200px;">Test 300 - <a href="http://www.google.com" target="_blank">Link</a></div>' 
    }); 

    google.maps.event.addListener(marker300, 'click', function() { 
     infowindow300.open(map, marker300); 
    }); 
}

來源

2013-12-18 fletcher

解決方案，如果你得到了正確的答案，將其標記爲正確的，爲了節省其他成員領帶在StackOverflow中 –

你必須使用中包含您與地圖使用額外的標記外部陣列。在你的情況我已經添加下面的數組：

var extraMarkers = [];

然後當我點擊複選框，我得到的是複選框的ID，並在這兩個showOverlays()和clearOverlays()把它作爲函數的參數。

然後，在showOverlays()中，我使用複選框ID作爲extraMarkers鍵並將標記作爲值。

最後，在clearOverlays()我再次複選框ID用來獲取與來自extraMarkers陣列此ID的元素和我看到地圖可以null，以除去標記。

看到這裏的工作示例：http://jsfiddle.net/x8D7y/1/

這裏是你所需的完整代碼：

var map; 
var extraMarkers = []; 
var myOptions = { 
    zoom: 8, 
    center: new google.maps.LatLng(45.0, 1.0) 
}; 

map = new google.maps.Map($('#map')[0], myOptions); 

var marker1 = new google.maps.Marker(
    { 
     position: new google.maps.LatLng(45.5, 1.5), 
     map: map /*, 
     icon: 'img/bike5.png' */ 
    } 
); 

var infowindow1 = new google.maps.InfoWindow(
    { 
     content: '<div style="width: 200px;">Test 1 - <a href="http://www.google.com" target="_blank">Link</a></div>' 
    } 
); 

google.maps.event.addListener(
    marker1, 
    'click', 
    function() 
    { 
     infowindow1.open(map, marker1); 
    } 
); 

function clearOverlays(myID) 
{ 
    google.maps.event.clearListeners(extraMarkers[myID], 'click'); 
    extraMarkers[myID].setMap(null); 
} 

function showOverlays(myID) 
{ 
    var marker300 = new google.maps.Marker(
     { 
      position: new google.maps.LatLng(45.0, 1.0), 
      map: map /*, 
      icon: 'img/bike5.png' */ 
     } 
    ); 

    extraMarkers[myID] = marker300; 

    var infowindow300 = new google.maps.InfoWindow(
     { 
      content: '<div style="width: 200px;">Test 300 - <a href="http://www.google.com" target="_blank">Link</a></div>' 
     } 
    ); 

    google.maps.event.addListener(
     marker300, 
     'click', 
     function() 
     { 
      infowindow300.open(map, marker300); 
     } 
    ); 
} 

$('#mapall').change(
    function() 
    { 
     var myID = $(this).attr('id'); 

     if($('#mapall').attr('checked')) 
     { 
      showOverlays(myID); 
     } 
     else 
     { 
      clearOverlays(myID); 
     } 
    } 
);

來源

2013-12-18 08:07:06

if you have single marker on map then use marker.setMap(null); 
if Multiple marker make an array for marker 
markersArray.push(marker); 
if (markersArray) { 
    for (i in markersArray) { 
      markersArray[i].setMap(null); 
     } 
}

來源

2013-12-18 08:09:40 AAA

試試這個：

marker300.setMap(null);

來源

2013-12-18 08:12:56 Vaughn

你的標記是不可見的外的showOverlays()函數。錯誤報告在控制檯：

Uncaught ReferenceError: marker300 is not defined

最小變化是定義marker300全球：

var map; 
var marker300;

和

function clearOverlays() { 
    google.maps.event.clearListeners(marker300, 'click'); 
    marker300.setMap(null); 
}

刪除標記，並在功能可變marker300的前除去varshowOverlays()

見example in fiddle

如果你想有幾個指標比你必須遵循用戶Merianos尼科斯

來源

2013-12-18 08:42:59

從Google Maps API V3中刪除標記

回答

相關問題