將谷歌地圖添加到頁面時出錯

-1

我正在嘗試將帶有標記的谷歌地圖添加到我的表單中以幫助用戶選擇位置，但它出錯了。將谷歌地圖添加到頁面時出錯

Error when entering the form

正如你看到的，地圖上沒有正確地在其區域中顯示。我在地圖上放置了一個標記，並在那裏設置了中心，但該標記的位置不正確，它隱藏在初始地圖之外（位於上圖中的右上角，而不是中間）。

當我擊中F12按鈕啓用螢火蟲（在Firefox），地圖顯示正確 The map display correctly when enable firebug

下面是創建的形式和添加谷歌地圖的代碼：

index.html中的形式文件：

<div id="map_company" style="float: left; width: 500px;height: 350px;"> 
<label style="margin-bottom: 5px;">Chọn vị trí hãng xe trên bản đồ:</label> 
<div id="map_canvas" style="width: 100%; height: 100%; position: relative;"></div> 
</div>

而且在腳本文件的JavaScript：

//add map to company tab 
//Set Center 
var myOptions = 
{ 
center: new google.maps.LatLng(21.044813, 105.79864), 
zoom: 13, 
mapTypeId: google.maps.MapTypeId.ROADMAP, 
zoomControlOptions: { 
    style: google.maps.ZoomControlStyle.SMALL 
} 
}; 
map = new google.maps.Map(document.getElementById("map_canvas"), 
    myOptions); 
var comMarker = new google.maps.Marker({ 
position: new google.maps.LatLng(21.044813, 105.79864), 
    map: map, 
draggable: true 
}); 
google.maps.event.addListener(comMarker, 'dragend', function { 
document.getElementById("cLat").value = this.getPosition().lat(); 
document.getElementById("cLon").value = this.getPosition().lng(); 
});

任何人都可以幫助我找出問題在這裏，我甚至不知道如何解釋它到谷歌。

來源

2013-01-21 BeckyPinoco

給你的map_canvas一個固定的大小（以像素爲單位，不是百分比），並移除position = relative。如果你使用百分比，父節點也必須有一個大小，否則它是沒有意義的（100％是什麼？）。

<div id="map_canvas" style="width: 400px; height: 300px;"></div>

來源

2013-01-21 08:43:07 Marcelo

看來您使用了選項卡。

如果是，則必須在選中帶有地圖的選項卡時觸發地圖的調整大小事件。

來源

2013-01-21 13:52:01

將谷歌地圖添加到頁面時出錯

回答

相關問題