Кордова Admob вызывает отображение карты google «серый» в закладках Ionic

Question

Запуск ионных вкладок. Мои карты работают нормально, пока я не перейду на другую вкладку, а затем снова вернусь к карте. Когда вы возвращаетесь на вкладку карты, большая часть карты выделяется с небольшим количеством карты, все еще появляющейся в верхнем левом углу. Если я захвачу видимую часть карты и перетаскиваю ее в центр, я вижу, что видимые карты составляют около 2/3 экрана, но в тот момент, когда я отпустил видимую часть, откат вверх до верхнего левого угла - и теперь все ранее серая часть была просто пустой белой.

Кроме того, если я просто поворачиваю свое устройство с портрета на пейзаж - карта полностью правильно перерисовывается. А затем от пейзажа до портретного режима, и все карты снова отображаются.

Для жизни меня, однако, я не могу получить «серый» из происходящего.

В моем apps.js:

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    globalGPS() ; 
    }); 
}) 

.config(function($stateProvider,$urlRouterProvider) { 
    '$compileProvider', 
    function($compileProvider) 
    { 
     $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?||tel):/); 
     // Angular before v1.2 uses $compileProvider.urlSanitizationWhitelist(...) 
    } 
    $stateProvider 

    // setup an abstract state for the tabs directive 
    .state('tab', { 
    url: "/tab", 
    abstract: true, 
    templateUrl: "templates/tabs.html", 
    controller: 'TabsCtrl' 
    }) 

    // Each tab has its own nav history stack: 
    .state('tab.map', { 
    url: '/map', 
    views: { 
     'tab-map': { 
     templateUrl: 'templates/tab-map.html', 
     controller: 'MapCtrl' 
     } 
    } 
    }) 

GPS-функции происходят вне государственных/контроллеров, загруженных из стандартного файла JavaScript, и когда все GPS то же внешняя функция устанавливает карту в качестве глобального вар:
setMap = new google.maps.Map(document.getElementById("mapBody"), myOptions);

В моем контроллере определяется:

.controller('MapCtrl', function($scope,$rootScope,constants) { 
     // runs this code on EVERY return to map tab 
     $scope.$on('$ionicView.beforeEnter', function(){ 
     if (setMap) { 
      google.maps.event.addListener(setMap, "idle", function(){ 
      google.maps.event.trigger(setMap, "resize"); 
      }) ; 
      // $scope.refreshMap() ; // see note below 
     } 
     }); 

     $scope.refreshMap = function() { 
      setTimeout(function() { 
      $scope.refreshMap_(); 
      }, 1); 
     }; 

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

reattachMap () Внешняя функция:

function reattachMap(map,div) { 
    if (!isDom(div)) { 
    return map; 
    } else { 
    map.set("div", div); 
    while(div.parentNode) { 
     div.style.backgroundColor = 'rgba(0,0,0,0)'; 
     div = div.parentNode; 
    } 
    return map; 
    } 
} 

На месте google.maps.event.trigger (setMap, «изменить размер»), я попытался с помощью реплантации карты DIV мышления он был удален из DOM. Ни один из методов не работает или даже не указывает, что я нахожусь на правильном исправлении. В моих Див-х, которые держат карты я даже жесткий набор значений CSS ширина/Heigh, как я прочитал, что фиксированные проблемы некоторых ППЛ (а ширина/высота в процентах вызывает проблемы):

<div id="mapWrapper" style="position:absolute;width:100%;height:100%"> 
    <div id="mapBody" data-tap-disabled="false"></div> 
    </div> 
    </div> 

и

#mapBody { 
    border:2px solid #4e8cf9; 
    text-align:center; 
    height:700px; 
    width:400px;*/ 
    flex: 1; 
} 

Answer 1

Ну, я решил проблему. Оказалось, что при переходе от закладки карты к другой вкладке эти другие вкладки загружают объявления с помощью AdMob. Объявления AdMob не являются частью основного DOM, они являются подзадачей и, следовательно, они постоянны. Если вы перейдете на другую вкладку, объявление останется на том же месте на новой вкладке. Когда вы переходите на вкладку карты, это объявление следует и каким-то образом препятствует правильной отображению карты Google Maps.

В моем приложении, первый вид по умолчанию на вкладке карта, которая не показывает рекламу, поэтому нет картографических вопросов, пока пользователь возвращается на вкладку карты (... и персистирующей AdMob объявления не последовало)

Sooo ... я теперь использовал указанную выше функцию, чтобы полностью удалить объявление из вида карты.

.controller('MapCtrl', function($scope,$rootScope,constants) { 
     $scope.$on('$ionicView.beforeEnter', function(){ 
     // this function will run EVERY time user goes back to this tab 
     if (setMap) { // only attempt to remove ad if 'map' is defined 
      removeAd() ; // global external function 
     });