javascript - 重新初始化gmap3 map

Question

是否可以将 gmap3 map 重新初始化为其默认设置(纬度、经度、缩放等)？

我尝试在 map 上销毁然后重新运行初始化，但它不起作用。

在这里查看我的 jsfiddle - http://jsfiddle.net/vlowe/z9dDE/1/

Answer 1

将 map 元素包裹在一个容器div中，然后当你想重置 map 时，只需移除整个 map div并重新创建它。这应该可以解决问题。

根据gmap3文档，在移除dom元素之前，仍然需要在 map 上调用destroy。

HTML代码

<div>
    <div id="map"></div>
</div>

<a href="#" onclick="restore();">restore</a>​

JavaScript

var dlat = 53.9783997; // default map latitude
var dlng = -1.5666347; // default map longitude
var dzoom = 6; // default map zoom
var dmaptype = "roadmap"; // default map type
// create gmap
$('#map').gmap3({
    action: 'init',
    options: {
        center: [dlat, dlng],
        zoom: dzoom,
        mapTypeId: dmaptype,
        mapTypeControl: true,
        mapTypeControlOptions: {
            style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
        },
        navigationControl: true,
        scrollwheel: true,
        streetViewControl: true
    }
});


function restore() {

    $('#map').gmap3({
        action: 'destroy'
    });

    var container = $('#map').parent();
    $('#map').remove();
    container.append('<div id="map"></div>');

    // create new gmap
    $('#map').gmap3({
        action: 'init',
        options: {
            center: [dlat, dlng],
            zoom: dzoom,
            mapTypeId: dmaptype,
            mapTypeControl: true,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
            },
            navigationControl: true,
            scrollwheel: true,
            streetViewControl: true
        }
    });

}​