谷歌地图不能完全加载后inital电话

我在我的网站上使用Angular.js，我可以加载地图上的一个特定的地理编码与我从服务器上的GET请求获得的数据。但是，当用户转到新页面时，地图加载...但仅部分加载。地图的其余部分是灰色地带。我的代码如下：谷歌地图不能完全加载后inital电话

data.map.center = new google.maps.LatLng(parseFloat(response.geocode.latitude), parseFloat(response.geocode.longitude)); 
data.map.mapEnabled = true; 
var map_canvas = document.getElementById('map_canvas'); 
var map_options = { 
    center: data.map.center, 
    zoom: 15, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    zoomControl: false, 
    panControl: false, 
    scrollwheel: false, 
    draggable: false, 
    mapTypeControl: false, 
    streetViewControl: false 
}; 

data.map.mapObject = new google.maps.Map(map_canvas, map_options); 
var marker = new google.maps.Marker({ 
    map: data.map.mapObject, 
    position: data.map.center 
});

是否有一个原因地图加载部分在下一页？当我刷新它然后全部加载它，但它为什么最初不工作？

我读了下面这样的：

Google Maps API v3: How to remove all markers?

Google Maps API V3 not rendering competely on tabbed page using Twitter's Bootstrap

Google Maps don't fully load

编辑

看来的部分原因是我不令人耳目一新用户点击时的页面在第二个环节。我只使用哈希，然后加载它......不知道是否有什么我应该做的不同，为此？

来源

2014-11-20 KVISH

我这是怎么设法做它，你定义在控制器的初始化函数，那么调用相对的范围为$ scope.initialize

appControllers.controller('ContactpageController',['$scope',function($scope){ 


$scope.initialize=function() { 
      var myLatlng = new google.maps.LatLng(-37.815207, 144.963937); 
      var mapOptions = { 
       zoom: 15, 
       scrollwheel: false, 
       center: myLatlng, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
      var marker = new google.maps.Marker({ 
       position: myLatlng, 
       map: map, 
       title: 'Hello World!' 
      }); 
     } 

     $scope.initialize(); 

}]);

来源

2014-12-11 12:42:30 Bakly

在这里找到了答案：

http://www.ultrawebsites.com/2013/05/angularjs-angularui-maps-module-and-page-reload/

我的代码是在这里：

setTimeout(function() { 
    google.maps.event.trigger(data.map.mapObject, 'resize'); 
    data.map.mapObject.setCenter(data.map.center); 
}, 100);

我把这个下面的代码之上。

来源

2014-11-20 19:42:40 KVISH

这对我没有工作，甚至没有设置后超时为1000，但会添加为我工作的解决方案作为答案 – Bakly 2014-12-11 12:34:48

我会接受您的答案，它也适用于我。 – KVISH 2014-12-11 18:16:42

谷歌地图不能完全加载后inital电话

回答

相关问题