Google地图是灰色的 [英] Google Maps is grey
问题描述
我在使用html和javascript的移动应用程序中使用Google地图。当我加载地图时,我只能看到左上角5%的地图。 95%的div容器是灰色的。
当我想用Firebug检查div时,整个地图突然加载。
那是什么?
我尝试了几个Stackoverflow线程,但没有解决方案为我工作。
谢谢。
I am using google maps in a mobile application using html and javascript. When the I load the map I am only able to see 5% of the map in the upper left corner. 95% of the div container is grey. When I want to check the div with Firebug the whole map is loaded suddenly. What can that be? I tried already several Stackoverflow threads but no solution worked for me. Thank you.
代码:
<link type="text/css" rel="stylesheet" href="jquery.mobile...>
<link type="text/css" rel="stylesheet" href="index.css">
<script type="text/javascript" src="jquery.mobile...></script>
<script type="text/javascript" src="jquery.mobile/jquery.mobile...></script>
<script type="text/javascript" charset="utf-8" src="cordova-2.1.0.js"> </script>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8" src="index.js"></script>
<div id="map" style="width: 700px; height: 700px;"></div>
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: new google.maps.LatLng(-33.92, 151.25),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
index.js
$(document).ready(function() {
$(window).resize(function() {
google.maps.event.trigger(map, 'resize');
});
});
当我使用以%或em度量的div属性时,所有的工作。
When I use div attributes measured in % or em it doesnt work at all.
推荐答案
尝试调用文档上的resize方法也可以:
Try calling the resize method on document ready too:
$(document).ready(function() {
$(window).resize(function() {
google.maps.event.trigger(map, 'resize');
});
google.maps.event.trigger(map, 'resize');
});
这篇关于Google地图是灰色的的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!