Question

Is it possible to re initialize a gmap3 map to its default settings (lat, long, zoom etc)?

I tried destroy on the map and then re run the initialise but it is not working.

See my jsfiddle here – http://jsfiddle.net/vlowe/z9dDE/1/

Answer 1

Wrap the map element in a container div, and then when you want to reset the map, just remove the whole map div and recreate it. This should solve the problem.

According to the gmap3 documentation, you still need to call destroy on the map before removing the dom element.

HTML code

<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
        }
    });

}​