为什么地图看起来堆叠在另一张地图上

时间:2015-02-27 10:32:15

标签: angularjs google-maps google-maps-api-3

我使用谷歌地图apis在我的应用程序中显示地图。当我缩小地图时,看起来地图已堆叠在另一个地图上。即似乎是另一张地图的一层。如何避免它,并请它为什么会发生。     在这里输入代码

var map = angular.module('map', ['inventoryFilters', 'inventoryServices'])
.controller('mapCtrl', function ($scope, $filter, $http, JsonFileRepo) {
var filteritems = [];
filteredSites();
$scope.$on('filter-updated', function (event) {
    filteredSites();
 });

function filteredSites() {
    JsonFileRepo.getSites().
        then(function (sites) {
            filteritems = "";
            $scope.sitesInfo = sites;
            filteritems = $filter('applyRegionSelections')($scope.sitesInfo);
            filteritems = $filter('applySoftwareSelections')(filteritems);
            updateMap(filteritems);

        },
        function () {
            console.log('sites retrieval failed.');
        });
 };
var mapOptions = {
    zoom: 2,
    center: new google.maps.LatLng(53.0, -1.0),
    mapTypeId: google.maps.MapTypeId.ROADMAP
}

$scope.map = new google.maps.Map(document.getElementById('map'), mapOptions);

$scope.markers = [];

var infoWindow = new google.maps.InfoWindow();

function createMarker (info) {

    var marker = new google.maps.Marker({
        map: $scope.map,
        position: new google.maps.LatLng(info.location.lat, info.location.lng),
        title: info.location.city,
       });
    marker.content = '<div class="infoWindowContent">' + info.name + '</div>';
    google.maps.event.addListener(marker, 'click', 
        (function (id) {
            return function(){
                infoWindow.setContent('<h2>' + marker.title + '</h2>' + marker.content);
                infoWindow.open($scope.map, marker);
                console.log("Floc id =" + id);
              };
        })( info.FLOCID)
    );

    $scope.markers.push(marker);

}

function updateMap(filteritems) {

    angular.forEach($scope.markers, function (marker) {
        marker.setMap(null);
    });

    $scope.markers.splice(0, $scope.markers.length);


    for (i = 0; i < filteritems.length; i++) {
        createMarker(filteritems[i]);
    }
};

0 个答案:

没有答案