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(); 
      });