谷歌地图中心加载失败答案

【问题标题】：Google maps centered load failure谷歌地图中心加载失败
【发布时间】：2015-06-30 11:49:21
【问题描述】：

好吧，我遇到了这个问题，加载地图一次，一切正常。第二次或一次更新地图加载不正常，但在导航时加载不居中，您可以看到已制作但变形或完全丢失的标记。

我尝试了几种方法来解决这个问题，首先我发现最常见的是使用google.maps.event.trigger(map 'resize')，但它没有工作，然后逻辑，尝试每当执行加载地图时，创建一个新地图，使用相同的数据和重点，但都不适合我。这也可能是我使用地图的方式。我在我的应用程序中使用相机的插件，用户拍照，这应该检测我在哪里绘制图片并显示地图。每次打开视图时，相机的插头，在拍摄和显示照片的过程中，我都会调用相应的函数来加载地图，这让我有点棘手立即加载我有一个很好的时间锁定在这个问题，我发现解决方案对我有用，但仅适用于浏览器，设备无法正常工作。我正在使用离子框架和插件cordova。

控制器：

.controller("CamaraCtrl", function($scope,$rootScope, Camera,$cordovaGeolocation,$state,$location,$ionicSideMenuDelegate) { 
  var posOptions = {timeout: 10000, enableHighAccuracy: false};
$cordovaGeolocation
  .getCurrentPosition(posOptions)
  .then(function (position) {
    var latitud_actual  = position.coords.latitude
    var longitud_actual = position.coords.longitude
    $scope.latitud = latitud_actual;
    $scope.longitud = longitud_actual;
          //$scope.map = new google.maps.Map(document.getElementById("mapa_ubicacion"), mapOptions);
  }, function(err) {
    // error
  });

  function initialize() {
var mapOptions = {
  center: new google.maps.LatLng($scope.latitud, $scope.longitud),
              zoom: 15,
              mapTypeId: google.maps.MapTypeId.ROADMAP,
              scrollwheel: false
};
var map = new google.maps.Map(document.getElementById("map"),
    mapOptions);
$scope.setMarker(map, new google.maps.LatLng($scope.latitud, $scope.longitud), 'Yo', '');
$scope.map = map;
}
$scope.setMarker = function(map, position, title, content) {
  var marker;
  var markerOptions = {
      position: position,
      map: map,
      title: title
  };

  marker = new google.maps.Marker(markerOptions);

  google.maps.event.addListener(marker, 'click', function () {
      // close window if not undefined
      if (infoWindow !== void 0) {
          infoWindow.close();
      }
      // create new window
      var infoWindowOptions = {
          content: content
      };
      infoWindow = new google.maps.InfoWindow(infoWindowOptions);
      infoWindow.open(map, marker);
  });
 }
 $scope.mostrar_form = false;
 $scope.mostrar_boton_view = false;
 $scope.getPhoto = function() {
Camera.getPicture().then(function(imageURI) {
  console.log(imageURI);
  $scope.lastPhoto = imageURI;
  $scope.mostrar_form = true;
  $scope.mostrar_boton_view = false;
  google.maps.event.addDomListener(window, 'load', initialize);  
  initialize();
}, function() {
  $scope.mostrar_boton_view = true;
}, {
  quality: 75,
  targetWidth: 320,
  targetHeight: 320,
  saveToPhotoAlbum: false
  });
 };
  $scope.getPhoto();
})

【问题讨论】：

标签： google-maps ionic-framework cordova-plugins

【解决方案1】：

我找到的唯一解决方案是创建一个再次执行地图的函数。它不应该是最优的，但至少它解决了我的问题。

$scope.centrar =  function(){
  var mapOptions = {
    center: new google.maps.LatLng($scope.latitud, $scope.longitud),
              zoom: 15,
              mapTypeId: google.maps.MapTypeId.ROADMAP,
              scrollwheel: false
   };
   var map = new google.maps.Map(document.getElementById("map"),
    mapOptions);
   $scope.setMarker(map, new google.maps.LatLng($scope.latitud, $scope.longitud), 'Yo', '');
   $scope.map = map;
}

【讨论】：