谷歌地圖API沒有顯示完整大小

我在我的iOS應用程序中使用jQuery手機。這裏是什麼，當我加載地圖碰巧裏面：谷歌地圖API沒有顯示完整大小

enter image description here

我用下面的腳本，以便產生這一點。

var map 
var mark 

function initialize() { 
    var latlng = new google.maps.LatLng(52.404657,-1.491413); 
    var myOptions = { 
    zoom: 13, 
    center: latlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById("map_canvas"), 
           myOptions); 


    mark = new google.maps.Marker({ 
             position: latlng, 
             map:map 
             }) 
} 

function mostrarUbicacion(){ 
    navigator.geolocation.getCurrentPosition(lecturaGPS , errorGPS , {enableHighAccuracy:true}) 
} 

function lecturaGPS(ubicacion){ 

    var miubicacion = new google.maps.LatLng(ubicacion.coords.latitude, ubicacion.coords.longitude); 

    map.setCenter(miubicacion) 
    mark.setPosition(miubicacion) 

} 

function errorGPS(){ 
    alerta(" unable to connect") 
}

HTML：

<body onload="initialize()" style="height:100%"> 
<div id="map_canvas" style="width:100%; height:50%; padding:0;"></div> 
<button onClick="mostrarUbicacion()"> Click to find where you are! </button> 
</body>

來源

2012-05-03 Robert Varga

我遇到同樣的問題。管理解決？ – GDawson

嘗試設置DIV的地圖和CSS是這樣的：

HTML：

<div class="Flexible-container" id="map" style="margin:1.5%;"> 
    <!-- this is the div for the map --> 
</div>

CSS：

/* Flexible iFrame */ 

.Flexible-container { 
    position: relative; 
    padding-bottom: 32.25%; 
    padding-top: 30px; 
    height: 0; 
    overflow: hidden; 
} 

.Flexible-container iframe, 
.Flexible-container object, 
.Flexible-container embed { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
}

調整寬度div使用百分比;您可以調整高度設置填充底部。

here the doc

來源

2013-10-22 00:06:08 tuned

谷歌地圖API沒有顯示完整大小

回答

相關問題