Disable Default Controls

Sometimes, when using Google Maps API in projects, the number of controls the user has on the map may need to be limited or even disabled entirely. Use cases like these might arise when only a particular map section needs to be displayed, but little interaction is needed.

How to disable the default UI controls?

The default UI can be disabled by updating the map’s disableDefaultUI property to true. This property can be found within the MapOptions object. Here’s a code snippet that shows how to update the disableDefaultUI property:

const map = new google.maps.Map(document.getElementById("map"), {
  ...
  disableDefaultUI: true,
});