2017-02-24 17 views
1

私は、会社が国をarroundストアしていることを示すチラシマップと、州によって店舗をフィルタリングするために使用できるフォームを持っていますが、私が州を変更すると、マーカーをリフレッシュしないでください。これどうやってするの? Angular Leafletを使用しています。位置を返す関数は機能しますが、マーカーは変更されません。下に私のコードがあります:角度リーフレットの地図更新

$http.get(url_sistema + 'mapaFiltro/'+estado).then(function(response) { 
        var local_icons = { 
         default_icon: { 
          iconUrl: url_sistema+'web_files/img/marker.png', 
          iconSize: [35,50], 
          iconAnchor: [18, 50] 
         } 
        }; 
        angular.extend($scope, { 
         icons: local_icons, 
         center: { 
          lat: -20.0990815, 
          lng: -52.6113324, 
          zoom: 4 
         }, 
         markers: [], 
         defaults: { 
          tileLayer: "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", 
          zoomControlPosition: 'topright', 
          tileLayerOptions: { 
           opacity: 0.9, 
           detectRetina: true, 
           reuseTiles: true, 
           attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> | &copy <a href="http://www.openstreetmap.org/copyright">AngelLira</a>', 
          }, 
          scrollWheelZoom: false, 
          minZoom: 2, 
          worldCopyJump: true 
         } 
        }); 
        for (var i = 0; i < response.data.dados_mapa.length; i++) { 
         $scope.markers.push(
          { 
           'lat': response.data.dados_mapa[i].latitude, 
           'lng': response.data.dados_mapa[i].longitude, 
           'focus': false, 
           'message': 
            '<div class="logo_mapa">'+ 
             '<img src="web_files/img/logo_mapa.png">'+ 
            '</div>'+ 
            '<div class="texto_mapa">'+ 
             '<h1>'+response.data.dados_mapa[i].titulo+'</h1>'+ 
             '<h2>'+response.data.dados_mapa[i].telefones+'</h2>'+ 
             '<h2>'+response.data.dados_mapa[i].email+'</h2>'+ 
             '<p>'+response.data.dados_mapa[i].endereco+'</p>'+ 
            '</div>' 
           , 
           'draggable': false, 
           'icon': local_icons.default_icon 
          } 
         ); 
        } 
       }, function(error) { 

       }); 

私の要求の応答は、私がマップに表示する必要があります新しいマーカです。

答えて

0

あなたがプッシュマーカーのforループの後に、この部分のコードを追加します。さらには

leafletData.getMap().then(function(map) { 
     setTimeout(function() { 
      map.invalidateSize(); 
      map._resetView(map.getCenter(), map.getZoom(), true); 
     }, 200); 
    }); 

、あなたはコントローラにleafletDataを注入する必要があります。

関連する問題