定位谷歌地圖停留在左上角

我剛剛在網站上添加了googlemap。我被放置在一個map_canvas提供DIV的toturials介紹，這DIV嵌套在另一個DIV中，如：定位谷歌地圖停留在左上角

現在的問題是，在的左上角的地圖圖塊stayes但不是地圖像這樣的背景http://screencast.com/t/jeUSKijjwE

什麼可能是錯的？

2011-10-21 Rasmus Christensen

---- UPDATE -----剛剛看到當瀏覽器恢復並再次最大化時，那麼地圖繪製正確.....但爲什麼？ –

http：// stackoverflow。com/questions/8803323/google-maps-api-map-sometimes-appear-only-on-upper-left-corner-of-its-div/11006250＃11006250 – maksbd19

拉斯穆斯，我結束了在這裏解決問題的股利與谷歌地圖...

我調用的函數checkResize（）;

我把變量地圖在地圖載入其中（即「檢查」我的DIV和調用的函數：

maps.checkResize（）;

我能夠在這個環節的幫助：Google map only loading half of itself

馬塞洛馬里尼

來源

2011-10-25 16:32:08

好吧，這似乎工作，謝謝，不，我只是需要找出將它放在哪裏。如果它在Initialize中，那麼整個頁面都會生效。 –

我有這個問題，並發現，在我的情況下，問題是，我是創建使用JavaScript的innerHTML的DIV map_canvas提供。

地圖第一次會正確顯示，但第二次我會調用它（不同的地圖），它會顯示相同的地圖（錯誤的地圖），第三次我會調用另一個地圖它會顯示它只在左上角。它將在所有其他呼叫的頂部角落。

我所要做的只是將div放在原始的HTML中，並且從此出現完美的效果。

希望這可以幫助別人！

來源

2011-11-06 00:22:52 user1030607

這通常是顯示，隱藏或調整地圖大小的問題。

在谷歌地圖v3中，我相信你可以撥打google.maps.event.trigger(map, 'resize');其中map是你的谷歌地圖對象的參考。

來源

2012-03-16 18:47:51 broox

我建議加載地圖有一段時間延遲後檢查div是否可見或哪些是要保存地圖。爲我工作

$(document).ready(function() { 
     $('.togglebtn').click(function() { 

if(!$('#map_canvas').is(':visible')){ 
       setTimeout(function(){initialize()}, 500); 
       } 
    }); 
}); 


    //your function 
function initialize() { 


     var mapOptions = { 
      zoom: 3, 
      center : new google.map.LatLng(31.510474,80.352287), 
      center: new google.maps.LatLng(44.510474, 50.352287), 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 
     var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); 

     var contentSC_PAK = "SoftCircles Pakistan"; 
     ..... 
     ..... 

     and rest of your map code to initialize map 



     }); 

    }

來源

2014-08-19 08:21:33

你必須使用autosizse選項。我有同樣的問題，我解決了它。

這裏的代碼，當你打開一個模式，並在裏面，調用一個locationpicker。

$scope.map_picker = function(){ 
     $("#map_modal").modal('show'); 
     $('.us2').locationpicker({ 
      location: {latitude: 33.997215339647724, longitude: -81.02654766235355}, 
      radius: 300, 
      inputBinding: { 
       latitudeInput: $('.us2-lat'), 
       longitudeInput: $('.us2-lon'), 
       radiusInput: $('#us2-radius'), 
       locationNameInput: $('#us2-address') 
      } 
     }); 

    **$('#map_modal').on('shown.bs.modal', function() { 
      $('.us2').locationpicker('autosize'); 
     });** 
}

主要邏輯只需要使用此行： $ locationpicker（ '自動調整大小 '）;（' US2。'）。但重要的是你如何以及在哪裏調用這條線。

來源

2015-04-27 07:05:45 jatin

定位谷歌地圖停留在左上角

回答

相關問題