Question

我在我的应用程序中有两个带有谷歌地图的动态标签...在创建选项卡时动态地谷歌地图也在为画布创建div标签后初始化（调用地图函数）...我的问题，当我导航到标签我将div显示为show..it仅显示画布.....我的地图未显示...

我想在该地图中显示最后一个地图的地图内容.....

我的建议低于......

 $("#content").append("<div id='" + $(link).attr("value") + "_content' style='width:100%; height:100%'></div>");
             var mid = $(link).attr("value")+"_content";

             tab1map(mid);

地图编码：

function tab1map(mid) {

       alert("Inside "+mid+" Map");
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById(mid),
        myOptions);

    $(mid).css("height","100%");

    var marker = new google.maps.Marker({
      position: latlng, 
      map: map,
      title:"Hello World!"
  });
  }

在标签之间导航：

$('#tabs a.tab').live('click', function() {



                var tabName= $(this).attr("id");

                var contentname = tabName+ "_content";
                // hide all other tabs

                $("#content div").hide();

                $("#tabs li").removeClass("current"); 


                // show current tab
                $("#" + contentname).show();tab1map(contentname);

               $(this).parent().addClass("current");
            });

Answer 1

您应该尝试触发map resize事件，因此它强制渲染。在地图可见之前，地图不会渲染它。

用户google.maps.event.trigger（map，'resize'）来实现这一目标。

@see：http://code.google.com/intl/fr/apis/maps/documentation/javascript/reference.html#Map

如何在导航Tabs时调用Div的内容

1 个答案: