谷歌地圖只是部分顯示

你好，我有這個問題，當我加載一個地圖，在一個隱藏的div頁面地圖加載只是部分地圖，左上角的1/4，如何地圖渲染良好當它裝載的容器不隱藏時。谷歌地圖只是部分顯示

我準備這個的jsfiddle示例頁面：

$("#toggleAdvanced").click(function(){ 
    $("#advancedSearch").slideToggle("fast", function() { 
     google.maps.event.trigger(map, 'resize'); 
    }); 
});

如果你嘗試，點擊「點擊」的文字，你會看到地圖只是部分加載，如何不斷嘗試改變來自#map_wrapper的CSS {display：none; } to #map_wrapper {display：block; }和地圖點擊隱藏和顯示按鈕的作品完美。

正如你所看到的，我在幻燈片效果後觸發google.maps.event.trigger（map，'resize'）事件，所以它應該可以工作......（正如我發現的其他隊列中所述）

有什麼不對？或者我該如何解決這個問題？

來源

2013-04-20 Dragnovich

感謝丹尼爾·喬丹，我是被dinamically加入被重置，每格顯示/隱藏之後的一切，要解決它，我增加了一個變量來檢查，如果地圖已經initializated現在everithing是正確的。

var mapInit = 0; 
$(document).ready(function() { 
    $("#toggleMap").click(function(){ 
     $("#map_wrapper").slideToggle("fast", function() { 
      if(mapInit == 0) { initialize(); mapInit = 1; } 
      google.maps.event.trigger(map, 'resize'); 
     }); 
    }); 
});

這對這個話題

如何以往如果地圖（在開始時是）已經initializated解決爲什麼調用事件調整大小沒有工作？（這似乎是一個錯誤，其他許多類似這樣的問題提的是，也稱該事件並沒有發生任何事情。

問候

來源

2013-04-27 20:03:57 Dragnovich

沒問題，很高興你把它排序。 – 2013-04-28 11:36:48

你在未顯示的div上過早地調用初始化函數，這意味着當div由jquery顯示與此過程和映射存在衝突時。

看看這裏的小提琴。 http://jsfiddle.net/Z5AGP/2/

$(document).ready(function() { 


     $("#toggleMap").click(function(){ 
      $("#map_wrapper").slideToggle("fast", function() { 
       initialize(); 
       google.maps.event.trigger(map, 'resize'); 
      }); 
     }); 
    });

來源

2013-04-20 17:53:01

好了，現在我看地圖，之後的「滑效應」，怎麼過何必當初沒有與rezise事件一起工作？每次我點擊切換按鈕時，地圖將被重新初始化，這是否正確使用？我的意思是，如果我添加dinamically一些可拖動的標記，移動它們並在我重新顯示時隱藏地圖al會消失嗎？還是不是？ – Dragnovich 2013-04-27 19:35:06

谷歌地圖只是部分顯示

回答

相關問題