Javascript 谷歌地图加载部分点击隐藏标签

我使用两个选项卡，第一个用于显示列表，另一个用于显示地图。 当第一次加载页面时，默认情况下会显示1个选项卡，并在单击第二个选项卡时显示地图，但当我单击“列表”选项卡并再次单击“地图”选项卡“部分加载地图”时

以下是我的JAVASCRIPT代码：

$(document).on('click', "#load-map-view", function() {
        locateStores();
        $("#store-list-view").hide();
        $("#store-list-view").removeClass('disabled');

        $("#store-map-view").show();
        $("#store-map-view").addClass('disabled');
    });

function locateStores() {
    var mapContent;
    var map = new google.maps.Map(document.getElementById("store-map-view"), {
        center: new google.maps.LatLng(47.6145, -122.3418),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 13
    });
    var markers = [];
    $("#store-list-view .listed-shop").each(function() {
        markers.push({
            lat: $(this).attr('data-lat'),
            lng: $(this).attr('data-lan'),
            name: $.trim($(this).find('div.shop-name').text())
        });
    });
for (index in markers)
        addMarker(markers[index]);
    function addMarker(data) {


        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(data.lat, data.lng),
            map: map,
            title: data.name
        });

        var infobox = new InfoBox({
            content: document.getElementById("infobox"),
            disableAutoPan: false,
            maxWidth: 150,
            pixelOffset: new google.maps.Size(-140, -10),
            zIndex: null,
            boxStyle: {
                background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') no-repeat",
                opacity: 0.80,
                width: "400px"//"280px"
            },
            closeBoxMargin: "12px 4px 2px 2px",
            closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
            infoBoxClearance: new google.maps.Size(1, 1)
        });

        google.maps.event.trigger(map, 'resize');
        map.setZoom(map.getZoom());

        google.maps.event.addListener(marker, 'click', function() {
            $(".infoBox").fadeOut(300);
            infobox.open(map, this);
            map.panTo(new google.maps.LatLng(47.6145, -122.3418));
        });
    }

    var bounds = new google.maps.LatLngBounds();
    for (index in markers) {
        var data = markers[index];
        bounds.extend(new google.maps.LatLng(data.lat, data.lng));
    }
    map.fitBounds(bounds);

var pin = new google.maps.MVCObject();
    function openInfoWindow(marker) {
        title.innerHTML = marker.getTitle();
        pin.set("position", marker.getPosition());
        infowindow.open(map, marker);
    }
}

我尝试过几种解决方案，如： 添加此代码

google.maps.event.trigger(map, "resize");

还有许多其他的解决方案，但是页面仍然没有加载

---

有人能帮我吗

我已经解决了我遇到的问题

我在错误的位置添加了以下代码：

google.maps.event.trigger(map, "resize");

我的问题的解决办法是：

如果对隐藏分区使用map，请将map变量声明为全局变量

然后首先显示div，在显示div后加载贴图，并使用给定的代码调整其大小

    var map; //globalize your map variable
            // Then do the necessary loading

    $(document).on('click', "#load-map-view", function() {
            $("#store-list-view").hide();
            $("#store-list-view").removeClass('disabled');

            locateStores();
            google.maps.event.trigger(map, "resize");
    $("#store-map-view").show();
            $("#store-map-view").addClass('disabled');
        });