Google Карты


Карты Google — элементы управления по умолчанию

При отображении стандартной карты Google она поставляется с набором элементов управления по умолчанию:

  • Масштаб — отображает ползунок или кнопки «+/-» для управления уровнем масштабирования карты.
  • Pan — отображает элемент управления для панорамирования карты.
  • MapType — позволяет пользователю переключаться между типами карт (дорожная карта и спутник).
  • Просмотр улиц — отображает значок человечка, который можно перетащить на карту, чтобы включить просмотр улиц.

Карты Google – больше элементов управления

В дополнение к элементам управления по умолчанию в Картах Google также есть:

  • Масштаб - отображает элемент масштаба карты
  • Поворот — отображает небольшой круглый значок, который позволяет поворачивать карты.
  • Обзорная карта — отображает миниатюру обзорной карты, отражающую текущее окно просмотра карты в более широкой области.

Вы можете указать, какие элементы управления отображать при создании карты (внутри MapOptions) или с помощью вызова setOptions() для изменения параметров карты.


Карты Google — отключение элементов управления по умолчанию

Вместо этого вы можете отключить элементы управления по умолчанию.

Для этого установите для свойства DisableDefaultUI карты (в объекте параметров карты) значение true:

Пример

var mapOptions {disableDefaultUI: true}


Карты Google — включите все элементы управления

Некоторые элементы управления отображаются на карте по умолчанию; в то время как другие не появятся, если вы их не установите.

Добавление или удаление элементов управления с карты указывается в объекте параметров карты.

Установите для элемента управления значение true, чтобы сделать его видимым. Установите для элемента управления значение false, чтобы скрыть его.

Следующий пример включает все элементы управления:

Пример

var mapOptions {
  panControl: true,
  zoomControl: true,
  mapTypeControl: true,
  scaleControl: true,
  streetViewControl: true,
  overviewMapControl: true,
  rotateControl: true
}

Карты Google — Изменение элементов управления

Некоторые элементы управления картой можно настраивать.

Элементы управления можно изменить, указав поля параметров управления.

Например, параметры для изменения элемента управления масштабированием указываются в поле zoomControlOptions. Поле zoomControlOptions может содержать:

  • google.maps.ZoomControlStyle.SMALL - отображает элемент управления мини-зумом (только кнопки + и -)
  • google.maps.ZoomControlStyle.LARGE — отображает стандартный ползунок масштабирования.
  • google.maps.ZoomControlStyle.DEFAULT — выбирает лучший элемент управления масштабированием в зависимости от устройства и размера карты.

Пример

zoomControl: true,
zoomControlOptions: {
    style: google.maps.ZoomControlStyle.SMALL
}

Примечание. Если вы изменяете элемент управления, всегда сначала включите его (установите для него значение true).

Еще одним настраиваемым элементом управления является элемент управления MapType.

Опции для изменения элемента управления указываются в поле mapTypeControlOptions. Поле mapTypeControlOptions может содержать:

  • google.maps.MapTypeControlStyle.HORIZONTAL_BAR — отображать одну кнопку для каждого типа карты
  • google.maps.MapTypeControlStyle.DROPDOWN_MENU — выберите тип карты из выпадающего меню
  • google.maps.MapTypeControlStyle.DEFAULT — отображает поведение «по умолчанию» (зависит от размера экрана).

Пример

mapTypeControl: true,
mapTypeControlOptions: {
  style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
}

Вы также можете расположить элемент управления с помощью свойства ControlPosition:

Пример

mapTypeControl: true,
mapTypeControlOptions: {
  style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
  position: google.maps.ControlPosition.TOP_CENTER
}