2012-11-07 4 views
1

마커를 지우려면 .. 다음으로AngularJS와 - 내가 몇 가지 작은 문제 .. 시도 여러 가지 방법을 가지고 있지만 새로운 마커를 추가하기 전에 마커를 제거 할 수 있지만, 내가 설치가 제대로 작동 다음 한

예를 들어 컨트롤러에서 푸시 할 때마다 마커가 계속 추가됩니다. 새 마커를 추가하기 전에 기존 마커를 지우는 가장 좋은 방법은 무엇입니까?

var module = angular.module('Map', []); 
module.directive('sap', function() { 

    return { 
     restrict: 'E', 
     replace: true, 
     template: '<div></div>', 
     link: function(scope, element, attrs) { 
      var map = L.map(attrs.id, { 
       center: [-35.123, 170.123], 
       zoom: 14 
      }); 
      //create a CloudMade tile layer and add it to the map 
      L.tileLayer('http://{s}.tile.cloudmade.com/57cbb6ca8cac418dbb1a402586df4528/997/256/{z}/{x}/{y}.png', { 
       maxZoom: 18 
      }).addTo(map); 

      //add markers dynamically 
      var points = []; 
      updatePoints(points); 

     function updatePoints(pts) { 

       for (var p in pts) { 

        L.marker([pts[p].lat, pts[p].long]).addTo(map).bindPopup(pts[p].message); 
       } 

      } 


      scope.$watch(attrs.pointsource, function(value) { 
       updatePoints(value); 
      }); 

     } 


    }; 
}); 

그리고 컨트롤러 내부

는 새로운 마커를 추가 할 수있는 방법은 HTML에서

  $scope.pointsFromController.push({ 
       lat: val.geoLat, 
       long: val.geoLong 
      }); 

코드 pointsFromController 가정

<sap id="map" pointsource="pointsFromController"></sap> 

답변

1

간단 간단한 자바 스크립트 배열입니다. 간단하게 푸시를 실행 취소 할 수 있습니다.

$scope.removePoints = function() { 
    for (var i=$scope.pointsFromController.length; i>=0; i--) 
    $scope.pointsFromController.pop(); 
}; 
5

리플릿 작성자는 여기에 있습니다. 마커를 지우는 가장 좋은 방법은지도에 직접 추가하는 대신 그룹에 추가 한 다음 필요에 따라 group.clearLayers()를 호출하는 것입니다. http://leafletjs.com/examples/layers-control.html