Управление и исследование 3D-карты

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

Обзор элементов управления

Карты, отображаемые через 3D-карты в Maps JavaScript API, содержат элементы пользовательского интерфейса, известные как элементы управления исследованием , для поддержки взаимодействия пользователя с картой. Элементы управления исследованием отображаются в пользовательском интерфейсе карты по умолчанию, но их можно отключить для простоты или для создания места для пользовательских элементов управления. Обратите внимание, что сочетания клавиш для исследования карты доступны и при отключенных элементах управления.

API JavaScript для 3D-карт Maps также поддерживает навигацию пользователей по карте с помощью предустановленных траекторий движения камеры. Эти траектории можно настраивать и комбинировать для создания насыщенных 3D-эффектов.

Контроль за разведкой

На следующем изображении показан набор элементов управления по умолчанию, отображаемых 3D-картами в API JavaScript Карт:

Изображение карты с элементами управления

Ниже приведен список полного набора элементов управления 3D-карт в JavaScript-файле Maps:

  • Элемент управления масштабом отображает кнопки «+» и «-» для изменения уровня масштабирования карты.
  • Элемент управления «Перемещение » отображает кнопки «←», «→», «↑» и «↓» для изменения центра карты.
  • Элементы управления поворотом позволяют изменять направление камеры.
  • Регулятор наклона позволяет изменять наклон камеры.
  • Элемент управления «Компас» указывает направление на север по компасу и позволяет перенастроить камеру на северное направление.

В следующем примере кода показано переключение элементов управления исследованием:

JavaScript 

const map = new Map3DElement({
  center: { lat: 37.819852, lng: -122.478549, altitude: 2000 },
  tilt: 75,
  heading: 330,
  mode: MapMode.SATELLITE,
  defaultUIHidden: true,
});

HTML 

<gmp-map-3d
  mode="hybrid"
  range="639.274301042242"
  tilt="64.92100184857551"
  center="34.0768990953219,-118.47450491266041,292.9794737933403"
  heading="-61.02026752077781"
  default-ui-disabled
></gmp-map-3d>

Следующие шаги