Ограничить область обзора камеры и границы кадра.

Выберите платформу: Android iOS JavaScript

Вам может потребоваться управлять поворотом камеры, максимальной высотой или устанавливать границы широты и долготы, ограничивающие перемещение пользователя на заданной карте. Это можно сделать с помощью ограничений камеры .

В следующем примере показана карта с заданными границами местоположения, ограничивающими движение камеры:

Ограничить границы карты

Вы можете ограничить географические границы зоны действия камеры, задав параметр bounds .

Следующий пример кода демонстрирует ограничение границ карты:

async function init() {
  const { Map3DElement, MapMode } = await google.maps.importLibrary("maps3d");

  const map = new Map3DElement({
    center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
    tilt: 67.5,
    mode: MapMode.HYBRID,
    bounds: {south: 37, west: -123, north: 38, east: -121}
  });

init();
}

Ограничить доступ к камере

Вы можете ограничить движение камеры, установив любой из следующих параметров:

  • maxAltitude
  • minAltitude
  • maxHeading
  • minHeading
  • maxTilt
  • minTilt

Следующий пример кода демонстрирует ограничение доступа к камере:

async function init() {
  const { Map3DElement, MapMode } = await google.maps.importLibrary("maps3d");

  const map = new Map3DElement({
    center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
    tilt: 67.5,
    mode: MapMode.HYBRID,
    minAltitude: 1,
    maxAltitude: 1000,
    minTilt: 35,
    maxTilt: 55
  });

 document.body.append(map);
}

init();

Ограничьте границы карты и камеры.

Вы можете одновременно ограничить границы карты и камеры. Следующий пример кода демонстрирует ограничение границ карты и камеры:

async function init() {
  const { Map3DElement, MapMode } = await google.maps.importLibrary("maps3d");

  const map = new Map3DElement({
    center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
    tilt: 67.5,
    mode: MapMode.HYBRID,
    minAltitude: 1,
    maxAltitude: 1000,
    minTilt: 35,
    maxTilt: 55,
    bounds: {south: 37, west: -123, north: 38, east: -121}
  });

 document.body.append(map);
}

init();

Обработка жестов управления

Когда пользователь прокручивает страницу, содержащую карту, прокрутка может непреднамеренно привести к масштабированию карты. Вы можете управлять этим поведением, установив параметр gestureHandling map.

Обработка жестов: cooperative

«Совместная» обработка жестов позволяет пользователю прокручивать страницу, не влияя на масштабирование или перемещение карты. Для масштабирования пользователи могут использовать элементы управления, жесты двумя пальцами (для сенсорных устройств) или удерживать CMD/CTRL во время прокрутки.

Следующий код демонстрирует установку режима обработки жестов на "кооперативный":

new Map3DElement({
  center: { lat: 37.729901343702736, lng: -119.63788444355905, altitude: 1500 },
  tilt: 70,
  heading: 50,
  range: 4000,
  gestureHandling: 'COOPERATIVE',
});

gestureHandling: greedy

«Жадная» обработка жестов реагирует на все события прокрутки и сенсорные жесты.

gestureHandling: auto

Функция автоматической обработки жестов изменяет поведение карты в зависимости от того, находится ли карта внутри <iframe> и является ли страница прокручиваемой.

  • Если карта находится внутри <iframe> , обработка жестов будет "кооперативной".
  • Если карта не находится внутри <iframe> , обработка жестов будет "жадной".