Google지도에서 마커를 삭제할 수 없습니다.

Question

Google지도에서 마커를 제거하는 데 문제가 있습니다. 이 마커는 사용자가 웨이 포인트를 만들 때마다 만들어집니다. 그들은 웨이 포인트와 같은 위치에 있습니다. 이 마커에는 올바른 웨이 포인트와 마커를 제거하는 버튼이있는 InfoBox가 있습니다.

웨이 포인트가 생성 될 때마다 마커를 한 배열에, 정보창을 다른 배열에 푸시합니다.

웨이 포인트가 하나만있는 경우에 작동합니다. 마커와 웨이 포인트가 제거됩니다. 그러나 2 번 이상 가지고 나면 더 이상 작동하지 않습니다. 일단 waypoint 중 하나를 제거하려고하면, .setMap (null) 및/또는 .setPosition (null)을 호출하더라도 마커가지도에 남아있게됩니다. 마커를 제거 할 때마다 해당 배열에서 웨이 포인트 및 정보 상자도 제거합니다. 이상하게도 경로를 다시 그리는 함수를 호출하면 웨이 포인트가 더 이상 존재하지 않지만 마커는 그대로 있습니다. 여기

코드입니다 : 내가 생각

var markers = {   
    waypoints:{    
     p:[], 
     i:[], 
     m:[] 
    } 
}; 
var saveWaypoints = function(){ 
     removeWaypoints(); 

     var points = directionsRenderer.getDirections().routes[0].legs[0].via_waypoints;   

     for(var i=0;i<points.length;i++){ 
      var marker = new google.maps.Marker({ 
       map:map, 
       position:points[i], 
       icon: 'http://maps.google.com/mapfiles/ms/icons/yellow-dot.png', 
       id: i 
      }); 

      var infobox = new InfoBox({ 
       id: i, 
       position: points[i], 
       disableAutoPan: true, 
       boxStyle: { 
        background: "white", 
        opacity: 1, 
        width: "289px", 
        border: 0, 
        padding: 0 
       }, 
       zIndex: 1E4, 
       isHidden: false, 
       pane: "floatPane", 
       enableEventPropagation: false, 
       content: 'Pozicija: ' + points[i]    
      });    

      infobox.open(map,marker); 
      infobox.hide(); 

      google.maps.event.addListener(infobox,'closeclick',function(){ 
       markers.waypoints.m[this.id_].setMap(null); 
       markers.waypoints.m[this.id_].setPosition(null); 

       markers.waypoints.m.splice(this.id_,1); 
       markers.waypoints.p.splice(this.id_,1); 
       markers.waypoints.i.splice(this.id_,1); 

       drawPath(); 
      }); 

      google.maps.event.addListener(marker,'mouseover',function(){ 
       markers.waypoints.i[this.id].show(); 
      }); 

      google.maps.event.addListener(marker,'mouseout',function(){ 
       if(markers.waypoints.i[this.id] !== undefined){ 
        if(!markers.waypoints.i[this.id].keepOpen()){ 
         markers.waypoints.i[this.id].hide(); 
        } 
       } 
      }); 

      google.maps.event.addListener(marker,'click',function(){ 
       if(waypointDialog !== null){ 
        waypointDialog.doNotClose(false); 
        waypointDialog.hide(); 
       } 

       console.log(this.id); 

       waypointDialog = markers.waypoints.i[this.id]; 
       waypointDialog.doNotClose(true); 
      }); 

      markers.waypoints.m.push(marker); 
      markers.waypoints.i.push(infobox); 
      markers.waypoints.p.push({ 
       location: points[i], 
       stopover: false 
      }); 
     };    
    }; 

    var removeWaypoints = function(){ 
     if(markers.waypoints !== (null||undefined)){ 
      markers.waypoints.p = []; 
      markers.waypoints.m = []; 
      markers.waypoints.i = [];   
     }  
    };  

Answer 1

그 때마다 때문에 그 루프는 당신이 당신의 코드에서, 이전 마커에 액세스 할 수없는 이유입니다 마커를 만드는 것입니다, 난 단지 생각 마지막으로 만든 마커에 액세스 할 수 있습니다. 모든 마커에 액세스하려면 선언 후에 배열에 넣어야합니다. 이 코드

var markers=[]; //initialize it on global 

//and on creating marker, inside for loop add this code. 
markers.push(marker); 


//and to clear the markers in map try the code below 
for(var i=0; i< markers.length; i++) 
{ 
    markers[i].setMap(null); 
}