2014-08-03 3 views
0

Im, используя этот проект (http://angular-google-maps.org/#!/) для работы с AngularJS.Не удается скрыть предыдущее окно перед отображением следующего

В документации https://nlaplante.github.io/angular-google-maps/#!/api говорится, что мне нужно использовать директиву окна для отображения информации.

Я использую директиву окна внутри маркера.

Когда я нажимаю на маркер, появляется окно, находящееся под ним.

Если я щелкнул по второму маркеру, предыдущее окно не скроется.

Атрибут show, похоже, не сочетается с isIconVisibleOnClick, поэтому я не могу найти, как скрыть все остальные окна при отображении нового.

это код, который им с помощью:

myMapController.controller('MapController', [ 
'$scope', 
'markerService', 

function ($scope, markerService) { 
var markerCollection = []; 
$scope.options = {showWindow: false, window : {pixelOffset: new google.maps.Size(0, -30) , content: " - " } }; 


angular.extend($scope, { 
    map: { 
    control: {}, 
    center: { 
     latitude: 33.5, 
     longitude: -112 
    }, 
    zoom: 10, 
    fit: true, 
    visible: true, 
    pan: true, 
    options: { 
     navigationControl: true, 
     scaleControl: true 
    } 
    } 
}); 

$scope.showWindow = function($index){ 
    for(var i = 0; 0 < $scope.markers.length; i++){ 
    $scope.markers[i].show = false; 
    } 
}; 

$scope.verdad = false; 

var setMapMarkers = function(){ 
    var markers = {}; 
    var index = 0; 
    angular.forEach($scope.services, function (key) { 
    var service = key.address; 
    markerCollection.push(service); 
    var serviceId = service.service.id; 
    markers[index] = { 
     coords: { "latitude": parseFloat(service.latitude), "longitude": parseFloat(service.longitude)}, 
     message: service.service.organization.name + "<br>" + service.phone, 
     showWindow : false 
    }; 
    index++; 
    }); 
    $scope.markers = markers; 

}; 
setMapMarkers();  

} ]);

HTML-

<google-map center='map.center' draggable='true' pan='true' zoom='map.zoom'> 
     <layer type='TransitLayer'> 
      <marker click='showWindow(m)' coords='m.coords' fit='true' idkey='$index' ng-repeat='m in markers'> 
      <window isIconVisibleOnClick='true' options='{pixelOffset : options.window.pixelOffset}' show='m.show'> 
       {{m.message}} 
      </window> 
      </marker> 
     </layer> 
     </google-map> 

я ценю вашу поддержку :)

ответ

2

Вы могли бы следить за предыдущий маркер и установить его «ShowWindow» на «ложный», когда новый маркер щелкнул.

Мол,

_.each($scope.mymarkers, function(marker) { 
    marker.onClick = function() { 
     $scope.$apply(function() { 
      if(prevMarker) { 
       prevMarker.showWindow = false; 
      } 
      marker.showWindow = true; 
      prevMarker = marker; 
     }); 
    } 
}); 
+0

ах я не знал об этом атрибуте, спасибо! –