谷歌地圖不能在選項卡上工作Ionic

我在Ionic項目上創建選項卡。當我從另一個URL選項卡訪問Google地圖時，它不起作用，但是當我直接訪問它時，它可以正常工作。谷歌地圖不能在選項卡上工作Ionic

2016-03-15 Sihem Hcine

檢查這些帖子是否對您有用：http://stackoverflow.com/questions/34719011/config-angular-google-maps-with-ionic-framework/34722232#34722232，http：// stackoverflow .com/questions/34410064/google-maps-on-deviceready-problems/34411505＃34411505，http://stackoverflow.com/questions/34735180/google-maps-in-modal-not-showed-after-two-times -open-ionic/34743291＃34743291 – beaver

謝謝你:)）但他們都使用谷歌地圖在普通的頁面上，而不是在標籤頁中，我的問題是，當我從標籤的URL訪問其狀態但是當我從另一個標籤網址訪問標籤，然後移至Google地圖標籤時，無法顯示，因此我沒有錯誤信息！ –

不，有3個鏈接，第三個（http://stackoverflow.com/questions/34735180/google-maps-in-modal-not-showed-after-two-times-open-ionic/34743291#34743291）在第二個選項卡中有一個帶有地圖的CodePen示例... – beaver

首先離子部分：表示地圖的選項卡：

離子調用refreshMap（）當用戶選擇的選項卡。 refreshMap（）是：

.controller('MainCtrl', function($scope) { 
    $scope.refreshMap = function() { 
     setTimeout(function() { 
      $scope.refreshMap_(); 
     }, 1); //Need to execute it this way because the DOM may not be ready yet 
    }; 

    $scope.refreshMap_ = function() { 
     var div = document.getElementById("map_canvas"); 
     reattachMap(map,div); 
    }; 
})

我實現reattachMap（）看Map.init（）方法：

function reattachMap(map,div) { 
    if (!isDom(div)) { 
     console.log("div is not dom"); 
     return map; 
    } else { 
     map.set("div", div); 

     while(div.parentNode) { 
     div.style.backgroundColor = 'rgba(0,0,0,0)'; 
     div = div.parentNode; 
     } 

     return map; 
    } 
} 

function isDom(element) { 
    return !!element && 
    typeof element === "object" && 
    "getBoundingClientRect" in element; 
}

而且僅此而已，現在，當用戶切換回地圖標籤，它會在那裏。

請參閱此。（https://github.com/mapsplugin/cordova-plugin-googlemaps/issues/256/#issuecomment-59784091）

來源

2016-03-22 08:46:26 adjuremods

谷歌地圖不能在選項卡上工作Ionic

回答

相關問題