谷歌地圖第二次不加載 - AngularJS

我正在使用GoogleMap API（'angular-google-maps'js包），我有一個非常奇怪的行爲。谷歌地圖第二次不加載 - AngularJS

我第一次加載它，我得到加載的完整地圖，喜歡這裏： enter image description here

然後我關閉對話框，然後重新打開它，我看到： enter image description here

請記住，該地圖顯示爲另一個對話框頂部的對話框。

任何想法？

2014-10-29 Or A

您必須重繪地圖。您可以使用以下代碼執行此操作：

google.maps.event.trigger(map, 'resize');

這將使地圖刷新，修復您的問題。

來源

2014-10-29 14:26:38

如果您使用Angular Google Map模塊，則必須將refresh屬性添加到googlemap元素。

由於它寫入的模塊文件中：

刷新=「表達」 - 表達，如果它的值爲真，將觸發地圖刷新。當地圖最初隱藏時很有用。

來源

2014-10-29 16:18:06

知道這一點，如何通過JavaScript檢查，如果地圖最初是隱藏的？ – gerl 2015-04-21 16:59:14

只需添加：

$ scope.render = TRUE;

，並添加NG-IF =「渲染」你的地圖控制，就像這樣：

<ui-gmap-google-map ng-if="$parent.render" center="map.center" zoom="map.zoom"> 
     <marker coords="map.center"></marker> 
    </ui-gmap-google-map>

來源

2014-10-29 18:56:48

問題在這裏回答https://github.com/allenhwkim/angularjs-google-maps/issues/88

您需要手動居中，以避免這個問題像下面，

在你的js控制

$scope.$on('mapInitialized', function (event, map) 
{ 
    window.setTimeout(function() { 
     window.google.maps.event.trigger(map, 'resize'); 
     map.setCenter(new google.maps.LatLng(38,-98)); 
    }, 100) 
});

並在您的HTML

<ng-map ng-if="subView=='map'" center="38,-98" zoom="5"></ng-map>

來源

2016-04-24 04:25:22

谷歌地圖第二次不加載 - AngularJS

回答

相關問題