如何确保加载地图

时间:2015-01-08 15:50:28

标签: angular-google-maps

getGMap()返回Map对象的一个​​实例。如果映射未就绪,则此函数返回undefined。是否有事件或方式告诉地图已准备好并且调用getGMap肯定会返回谷歌地图?

由于

佳日

2 个答案:

答案 0 :(得分:12)

您可以使用控制器中的uiGmapIsReady - 请参阅docs中的IsReady

uiGmapIsReady返回:
- 地图加载并准备好后的承诺 - 一组地图信息(我称之为map_instances
- 数组长度取决于您在页面中加载的地图数量
- 数组中的每个对象都包含谷歌地图对象

在控制对象上使用getGmap()就好了,如下所示:

HTML

<div ng-app="myApp" ng-controller="myController">
    <ui-gmap-google-map 
        center="map.center" 
        zoom="map.zoom" 
        control="map.control">
    </ui-gmap-google-map>
</div>

CONTROLLER

myApp.controller('myController', function ($scope, uiGmapIsReady) {

    $scope.map = {
        center : {
            latitude: 37.7749295, 
            longitude: -122.4194155 
        },
        zoom : 14,
        control : {}
    };

    uiGmapIsReady.promise()
    .then(function (map_instances) {
        var map1 = $scope.map.control.getGMap();    // get map object through $scope.map.control getGMap() function
        var map2 = map_instances[0].map;            // get map object through array object returned by uiGmapIsReady promise
    });

});

请注意您还可以通过两种方法访问地图对象:
- 通过map_instances数组(看起来像[map1Instance, map2Instance, ...]
- 只要您在html和$scope.map.control.getGMap()

中定义了它,就可以通过$scope

JSFIDDLE

答案 1 :(得分:1)

您可以通过将其传递到&#34;事件&#34;来附加到tilesloaded事件。地图选项的属性。在地图上加载图块后,tileloaded会激活(因此会加载地图)。