javascript - 在 Bootstrap 选项卡上调整大小后，谷歌地图标记不居中

Question

我购买了一个地理位置 map 脚本，当应用于 Bootstrap 选项卡时，它只会显示左上角的小跨度。我添加了调整大小来克服它。

$(document).ready(function() { $(‘a[href=”#tab2”]’).click(function(e) {    setTimeout(initialise, 1000); }); </script>

function initialise() {
    var myMap = document.getElementById('map-myid1');
    google.maps.event.trigger(myMap, 'resize');
};
});

我面临的问题是 map 的标记不是中心，它将隐藏在 map 的左侧。如何解决？

See in real action

Answer 1

在 bootstrap 3.x.x 中，此脚本将提供帮助:

    var map;
    google.maps.visualRefresh = true;     // Enable the visual refresh
    function initialize() {
          // map initialization code 
    }

    google.maps.event.addDomListener(window, 'load', initialize);

    $(function () {
        $('a[href="#Location"]').on('shown.bs.tab', function(e) {
            lastCenter=map.getCenter();
            google.maps.event.trigger(map, 'resize');
            map.setCenter(lastCenter);

        });
    });

其中 a[href="#Location"] 是选项卡的 anchor 选择器。