Google地圖在Jquery標籤中顯示不正確

Question

我使用maplace插件在jQuery標籤中顯示Google Map時，當您放開地圖（第二個標籤）時，地圖無法完全加載。

DEMO ON FIDDLE

Answer 1

你需要把你的地圖div： <div class="map" id="gmap-dropdown"></div>
您tabs格之外，還有一些jQuery的邏輯：

Working fiddle

Answer 2

的解決方案是移動新將文檔加載到標籤單擊事件中。

工作小提琴： http://jsfiddle.net/6xwwv1pg/

參考代碼

$('[data-tab]').on('click', function (e) { 
      $(this) 
       .addClass('active') 
       .siblings('[data-tab]') 
       .removeClass('active') 
       .siblings('[data-content=' + $(this).data('tab') + ']') 
       .addClass('active') 
       .siblings('[data-content]') 
       .removeClass('active'); 
      e.preventDefault(); 

new Maplace({ 
     locations: LocsA1, 
     map_div: '#gmap-dropdown', 
     controls_title: 'Choose a location:' 
    }).Load(); 
      });