Question

我正在使用ionic，angularJS和Google Maps V3 API js，当我尝试在不同视图之间使用条形图导航时，谷歌地图无法正确加载。

我有一个介绍，它有一个按钮来打开包含地图对象的视图，当我触摸按钮时，除地图外，一切都很好。

 app.controller('MapController', function($scope, $ionicLoading) {

    google.maps.event.addDomListener(window, 'load', function() {

        var mapOptions = {
            zoom: 16,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

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

        navigator.geolocation.getCurrentPosition(function(pos) {
            map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));
        });


        $scope.map = map;

        $scope.$watch('$viewContentLoaded', function() {
        //call it here
        var element = (document.getElementById('map'));
        var windowHeight = window.self.outerHeight;
        var finalHeight = windowHeight * 0.62;
        element.style.height = finalHeight+'px';
        });
    });
});

如果我将包含地图的视图作为我的Web应用程序的第一个视图，则此代码可以正常工作。如何正确加载地图，或者有没有办法预加载所有视图？

使用离子导航栏，Google Maps对象不会加载Map对象

0 个答案: