Как программно установить атрибут карты Google на «жадный», не перезагружая и не восстанавливая карту в javascript?

Question

У меня есть следующий код в javascript, который является моим по умолчанию, у меня есть кнопка для пользователя, чтобы легче перемещать карту (без необходимости использовать оба пальца / или CTRL) Я знаю, что есть атрибут с именем gestureHandling: "greedy", но яНе могу понять, как установить его программно с помощью JavaScript без предварительной установки атрибута или перестроить / реконструировать карту, как мне это сделать?

map = new google.maps.Map(document.getElementById('map'), {
          zoom: 15,
          center: myLatLng,
          disableDefaultUI: true,
          mapTypeControl: false
});

Answer 1

Согласно документации, gestureHandling - это свойство MapOptions .

MapOptions, для которого нет выделенного установщика / получателя, можно установить с помощьюsetOptions

google.maps.event.addDomListener(document.getElementById('btn'), 'click', function() {
  map.setOptions({
    gestureHandling: 'greedy'
  });
});

фрагмент кода:

/**
 * This sample sets the gesture handling mode to 'cooperative',
 * which means that on a mobile device, the user must swipe with one
 * finger to scroll the page and two fingers to pan the map.
 */
function initMap() {
  var myLatLng = {
    lat: -25.363,
    lng: 131.044
  };

  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: myLatLng,
    gestureHandling: 'cooperative'
  });

  var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    title: 'Hello World!'
  });
  google.maps.event.addDomListener(document.getElementById('btn'), 'click', function() {
    console.log("before:" + map.gestureHandling);
    map.setOptions({
      gestureHandling: 'greedy'
    });
    console.log("after:" + map.gestureHandling);

  });
}

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

#map {
  height: 80%;
}

<input type="button" value="click" id="btn" />
<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap"></script>

Answer 2

Сохраните ваши настройки в объекте и примените их, когда вам нужно использовать функцию setOptions () для объекта карты;

// The Settings Object
let mapSettings = {
    zoom: 15,
    center: myLatLng,
    disableDefaultUI: true,
    mapTypeControl: false
}

// Your initial Map load
window.onload(function(){
    map = new google.maps.Map(document.getElementById('map'), mapSettings);
});

// Used when you want to apply different gesture handling
function greedyMap(){
    mapSettings.gestureHandling = 'greedy';
    map.setOptions(mapSettings);
}

<button onclick="greedyMap()">Example</button>