how to disable & enable google map on button click in java-script/jquery

Question

i want to show google map to my user on web page , but it should be disable for user interaction initially, when he click a button map become enable and he/she can interact with the map.

Answer 1

var showMap = $('#show-map');

function initialize() {
var mapOptions = {
    center: { lat: 0, lng: 0 },
    zoom: 8
};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}

$(document).ready(function(){
$('#show-map').on('click',initialize)
});

Demo