爲什麼我的Google地圖中的地圖與它的容器不一致

Question

我已經將地圖添加到了我的某個頁面，但內容與容器不匹配，我在獨立頁面中嘗試了相同的地圖它工作正常。

地圖呈現這樣的：enter link description here

地圖是在倫敦，而其中心，所以它看起來像和lignment問題，但我一直沒能解決它。這裏是創建地圖的功能：

function loadMap(){ 
    geocoder = new google.maps.Geocoder(); 
    var address = document.getElementById('address').value; 
    geocoder.geocode({ 'address': address}, function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) { 
     thisLocation = results[0].geometry.location; 
     console.log("location = " + thisLocation); 
     var tagem = new google.maps.LatLng(thisLocation); 
     var mapProp = { 
      center:new google.maps.LatLng(51.51121389999999, -0.11982439999997041), 
      zoom:5, 
      mapTypeId:google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("googleMap"),mapProp); 
     marker = new google.maps.Marker({position:tagem,animation:google.maps.Animation.BOUNCE}); 
     marker.setMap(map); 
    }else{ 
     console.log('Geocode was not successful for the following reason: ' + status); 
    } 
    }); 
} 

任何幫助，將不勝感激。

Answer 1

看起來你只需要告訴地圖調整大小。添加到您的loadMap的end（）函數：

google.maps.event.trigger(map, "resize");