无法使用ionic框架和ngMap将google map居中 [英] Can't center google map with ionic framework and ngMap

问题描述

我正在使用Ionic Framework b14和最新的ngmap，

I'm using Ionic Framework b14, and the latest ngmap,

我有一个显示地图的视图，但是当我要设置中心时，它不显示我从服务中获取的坐标.

I have a view that shows the map but when I want to set the center it does not show the coordinates I'm getting from a service.

(function() {

  var injectParams = ['$scope', '$stateParams', 'storeFactory'];
  var StoreController = function($scope, $stateParams, storeFactory) {
    var id = $stateParams.storeId;
    $scope.store;


    storeFactory.getStore(id)
      .success(function(store) {
        $scope.store = store;
      }).error(function(error) {
        $scope.status = ' ' + error.message;
      });


    $scope.$on('mapInitialized', function(event, map) {
      var myLatLng = new google.maps.LatLng(store.Latitude, store.Longitud);
      map.setCenter(myLatLng);

    });

  };

  StoreController.$inject = injectParams;

  angular.module('elizondo').controller('StoreController', StoreController);

}());

我想服务器必须花些时间才能响应，但是我不知道如何解决它，您可以给我任何帮助.

I suppose is has to be something with the time it takes the server to respond, but I have no idea how to fix it, any help you can give me.

谢谢.

推荐答案

您是正确的，mapInitialized侦听器函数将在从getStore成功回调之前执行.

You are correct, the mapInitialized listener function will execute before the success callback from getStore.

您可以将侦听器函数中的映射保存到变量中，并在回调中使用它:

You can save the map from the listener function in a variable and use that in your callback:

var map;

$scope.$on('mapInitialized', function(event, m) {
  map = m;
});

storeFactory.getStore(id).success(function(store) {

  $scope.store = store;

  var myLatLng = new google.maps.LatLng(store.Latitude, store.Longitud);
  map.setCenter(myLatLng);
});

如果您的map指令范围与StoreController范围相同，例如:

If your map directive scope is the same as the StoreController scope, for example:

<div ng-controller="StoreController">
  <map zoom="8"></map>
</div>

然后map对象将已经在控制器内的$scope上可用，因此您可以跳过mapInitialized侦听器功能(除非您也将其用于其他用途)，然后执行以下操作:

Then the map object will already be available on $scope within the controller so then you can skip the mapInitialized listener function (unless you are using it for something else as well) and just do:

storeFactory.getStore(id).success(function(store) {

  $scope.store = store;

  var myLatLng = new google.maps.LatLng(store.Latitude, store.Longitud);
  $scope.map.setCenter(myLatLng);
});

这篇关于无法使用ionic框架和ngMap将google map居中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！