CODEWITHSUNDEEP
google-mapsgoogle-maps-api-3
Георги Даскалов
Георги Даскалов

Reputation: 33

How to forbid moving around in the map on Google maps?

Is there any way to forbid the option about moving around the map?

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

I want my map to be positioned on the latitude and longitude, and the zoom to be specific, and the map to stay static (just like a picture), so you cannot see anything else than what is there in the map provided.

Upvotes: 0

Views: 69

Answers (2)

geocodezip
geocodezip

Reputation: 161334

Disable dragging, zooming, the default UI, etc..

var map = new google.maps.Map(document.getElementById('map-canvas'), {
    center: {
        lat: 42,
        lng: -72
    },
    zoom: 15,
    draggable: false,
    zoomControl: false,
    streetViewControl: false,
    mapTypeControl: false,
    disableDoubleClickZoom: true,
    scrollwheel: false,
    disableDefaultUI: true
});

proof of concept fiddle

code snippet:

function initialize() {
  var map = new google.maps.Map(document.getElementById('map-canvas'), {
    center: {
      lat: 42,
      lng: -72
    },
    zoom: 15,
    draggable: false,
    zoomControl: false,
    streetViewControl: false,
    mapTypeControl: false,
    disableDoubleClickZoom: true,
    scrollwheel: false,
    disableDefaultUI: true

  });
}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map-canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map-canvas"></div>

Upvotes: 0

Gustavo Andriuolo
Gustavo Andriuolo

Reputation: 81

try with static api:

https://maps.googleapis.com/maps/api/staticmap?center=-36.5443805,-62.0828073&zoom=7&size=800x600&maptype=road

Hope this help!

Upvotes: 1

Related Questions