谷歌地图与jquery选项卡

时间:2013-10-12 13:45:46

标签: jquery google-maps

我在内部Jquery标签中显示地图时遇到问题。 我没有看到完整的地图,只看到了它的一小部分。

我试着在没有任何运气的情况下关注另一篇文章。

我该如何解决?

由于

地图代码:

<div id="content_4" class="tab_block">

    <?PHP

        $pins .= "
                { 
                    address: '$address', 
                        html: { 
                        content: '<div>$fullName</div>', 
                        popup: true,
                    } 
                },  
                ";

    ?>
    <style>
        #map {
            height: 600px; 
            width: 600px;
            display: block;
            text-align: center;
        }
    </style>            
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script src="js/maps/jquery.gomap-1.3.2.min.js"></script>
    <script>
        $(function() { 
            $("#map").goMap({ 
            markers: [
                <?PHP echo $pins ?>

            ],
            maptype: 'ROADMAP' , //maptype: HYBRID, ROADMAP, SATELLITE, TERRAIN
            zoom: 11,
            }); 
        }); 
    </script>

    <div id='map'></div>

</div>

标签代码:

$(document).ready(function(){

// When a link is clicked
$("a.tab").click(function () {


    // switch all tabs off
    $(".active").removeClass("active");

    // switch this tab on
    $(this).addClass("active");

    // slide all content up
    $(".tab_block").slideUp();

    // slide this content up
    var content_show = $(this).attr("title");
    $("#"+content_show).slideDown();

});

});

1 个答案:

答案 0 :(得分:0)

当地图的容器div更改大小时,您必须在地图上触发resize -

google.maps.event.trigger(map, 'resize')

请参阅reference

中的地图对象的“事件”部分