带有jQuery选项卡的Google Map API

Question

我正在使用jQuery选项卡实现Google Map，但没有正确显示。

我试过这段代码来重新调整标签ID的地图onclick。

<script type="text/javascript"> 
    jQuery.noConflict(); 
    jQuery(document).ready(function() { 
     jQuery("#tab6").click(function() { 
      google.maps.event.trigger('location-canvas', 'resize'); 
      map.setCenter(bounds.getCenter()); 
      map.setZoom(16); 
     }); 
    }); 
</script> 

但没有工作。

我使用此选项卡脚本：Simple jQuery Responsive Tabs Interface Plugin - jQueryTab

而且我的jsfiddle是：Code

我会很高兴如果你指导我，帮助我解决这个问题。

谢谢。

Answer 1

1. 你触发'location-canvas'事件，什么是只有一个字符串，则必须提供google.maps.Map -instance作为参数

2. 触发调整大小事件的onclick可能还为时过早，使用的的after - 方法插件。

   after: function(){if($(this).text()==='Google Map'){ 
       //map must be the google.maps.Map-instance and available here 
       center=map.getCenter(); 
       google.maps.event.trigger(map,'resize'); 
       map.setCenter(center);            
   }} 
   

演示：http://jsfiddle.net/doktormolle/xzVpW/

注：map -variable不可用后的方法内。在我修改的小提琴中，我将实例存储在$('#location-canvas').data