我有一个应用程序,我使用谷歌地图API,首先它是完美的工作,现在地图不加载,因为它应该。我试图实现这一点:LINK科尔多瓦和jQuery的移动谷歌地图不加载
但是,当我改变的东西,并建立它到我的手机它突然只显示一个灰色地带。
这里是我的代码,它是如何工作的第一:
<div data-role="page" id="map">
<div data-role="header">
<a href="#dashboard" class="ui-btn ui-icon-carat-l ui-btn-icon-notext ui-alt-icon ui-corner-all ui-btn-left" data-transition="slide" data-direction="reverse">No text</a>
<h1>Plattegrond</h1>
</div>
<div id="map-canvas"></div>
<select id="type" onchange="filterMarkers(this.value);">
<option value="">Please select category</option>
<option value="restaurant">restaurant</option>
<option value="shopping">shopping</option>
<option value="toilet">toilet</option>
</select>
</div>
这里的javascript代码:
$(document).on("pagebeforeshow","#map",function(){
function initialize() {
var center = new google.maps.LatLng(51.458391, 5.391632);
var mapOptions = {
zoom: 18,
center: center,
mapTypeId: 'roadmap',
styles: myStyles
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
for (i = 0; i < markers1.length; i++) {
addMarker(markers1[i]);
}
}
// Init map
initialize();
});
比我剥代码下来,从那里我指的是链路使用的代码我真的不明白为什么它没有加载或显示。我实现我下面的地方JS谷歌的API链接的HTML这样的底部:
<script type="text/javascript" src="js/index.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBZZcdBQRqmJEzM1s3VmBh96Bw4dKQhoAU"></script>
如果我在浏览器中运行的第一次地图没有显示,但是当我刷新它显示...很奇怪但我怎样才能让它在手机上第一次显示?
当DIV的高度不确定它通常发生。尝试使用“pageshow”而不是“pagebeforeshow”内的initialize()函数。 – Navneeth
但是,如果我把它设置得太100%,它怎么会是不确定的?所以你建议改变“pagebeforeshow”到“pageshow”而不是initialize()? – Sreinieren
但是,这就像我现在只在“pagebeforeshow” – Sreinieren