ブラウザのサイズ変更後にGoogleマップが表示される

Question

問題は、クライアントキーが にある以下のコードを使用すると、入力欄に空のGoogleマップが表示され、ブラウザのサイズを変更すると地図が表示されることです。

何が間違っているのかわかりません... 何か助けてください。

$(document).on("pagecreate", function (event) { 
 
\t \t \t  initMap(); 
 
     }); 
 

 
\t \t function initMap() 
 
\t \t { 
 
       var map_options = { 
 
\t \t \t \t center: new google.maps.LatLng(-16.5112321,-68.1224865), 
 
\t \t \t \t zoom: 20, 
 
\t \t \t \t mapTypeId: google.maps.MapTypeId.ROADMAP 
 
\t \t   } 
 

 
\t \t \t map_canvas = document.getElementById('googleMap'); 
 
\t \t \t var map = new google.maps.Map(map_canvas, map_options); 
 
\t \t }

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> 
 
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
 
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
 
<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="googleMap" style="width:100%;height:400px;"></div>

Answer 1

溶液は、その後タブがアクティブであるINITマッピングすることであるので、私はjQueryのモバイルのTABSを使用しています。 回答＃55は、細かい作業をここにhttps://issuetracker.google.com/issues/35818323

$("#tabs").on("tabsactivate", function(event, ui) { 
       initMap(); 
    });