Камера и область просмотра

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

С помощью Maps SDK для iOS вы можете изменить точку зрения пользователя на карту, изменив камеру карты.

С помощью Maps SDK для iOS ваши пользователи могут наклонять и поворачивать ваши карты, чтобы настроить их ориентацию, удобную для их контекста. При любом уровне масштабирования пользователи могут перемещать карту или менять ее перспективу с минимальной задержкой.

Изменения в камере не приводят к изменению маркеров, полилиний или другой добавленной вами графики, хотя вы можете захотеть изменить эти дополнения, чтобы они лучше соответствовали новому виду.

Вид на карту

Maps SDK для iOS использует проекцию Меркатора для представления поверхности мира (сферы) на экране вашего устройства (плоской плоскости).

Положение камеры

Вид карты моделируется как камера, смотрящая вниз на плоскую плоскость. Положение камеры (и, следовательно, визуализация карты) определяется следующими свойствами: target (широта/долгота) , азимут , наклон и масштабирование .

Диаграмма свойств камеры

Цель (местоположение)

Целью камеры является местоположение центра карты, заданное как координаты широты и долготы.

Широта может находиться в пределах от -85 до 85 градусов включительно. Значения выше или ниже этого диапазона будут ограничены ближайшим значением в этом диапазоне. Например, если указать широту 100, будет установлено значение 85. Диапазон долготы составляет от -180 до 180 градусов включительно. Значения выше или ниже этого диапазона будут перенесены так, чтобы они попадали в диапазон (-180, 180). Например, 480, 840 и 1200 будут перевернуты на 120 градусов.

Пеленг (ориентация)

Направление камеры указывает направление по компасу, измеряемое в градусах от истинного севера и соответствующее верхнему краю карты. Если вы проведете вертикальную линию от центра карты до верхнего края карты, направление будет соответствовать направлению камеры (измеряется в градусах) относительно истинного севера.

Азимут 0 означает, что верхняя часть карты указывает на истинный север. Значение направления 90 означает, что верхняя часть карты указывает на восток (90 градусов по компасу). Значение 180 означает, что верхняя часть карты указывает на юг.

API Карт позволяет изменить направление карты. Например, кто-то за рулем автомобиля часто переворачивает карту дорог, чтобы совместить ее с направлением своего движения, в то время как туристы, использующие карту и компас, обычно ориентируют карту так, чтобы вертикальная линия указывала на север.

Наклон (угол обзора)

Наклон определяет положение камеры на дуге непосредственно над центральным положением карты, измеряемое в градусах от надира (направления, указывающего прямо под камерой). Значение 0 соответствует камере, направленной прямо вниз. Значения больше 0 соответствуют камере, наклоненной к горизонту на указанное количество градусов. Когда вы меняете угол обзора, карта отображается в перспективе: удаленные объекты кажутся меньше, а близлежащие объекты кажутся крупнее. Следующие иллюстрации демонстрируют это.

На изображениях ниже угол обзора составляет 0 градусов. На первом изображении показана схема этого; позиция 1 — это позиция камеры, а позиция 2 — текущая позиция на карте. Полученная карта показана под ней.

Скриншот карты с камерой, расположенной под углом обзора 0 градусов и масштабом 18.
Карта отображается с углом обзора камеры по умолчанию.
Диаграмма, показывающая положение камеры по умолчанию, непосредственно над положением на карте, под углом 0 градусов.
Угол обзора камеры по умолчанию.

На изображениях ниже угол обзора составляет 45 градусов. Обратите внимание, что камера перемещается на полпути по дуге между прямой головой (0 градусов) и землей (90 градусов) в положение 3 . Камера по-прежнему указывает на центральную точку карты, но область, представленная линией в позиции 4 , теперь видна.

Скриншот карты с камерой, расположенной под углом обзора 45 градусов и масштабом 18.
Карта отображается с углом обзора 45 градусов.
Диаграмма, на которой показан угол обзора камеры, установленный на 45 градусов, с уровнем масштабирования, установленным на 18.
Угол обзора камеры 45 градусов.

Карта на этом снимке экрана по-прежнему центрирована в той же точке, что и исходная карта, но в верхней части карты появилось больше объектов. Когда вы увеличиваете угол более 45 градусов, объекты между камерой и положением карты кажутся пропорционально больше, а объекты за пределами положения карты кажутся пропорционально меньшими, создавая трехмерный эффект.

Увеличить

Уровень масштабирования камеры определяет масштаб карты. При более высоких уровнях масштабирования на экране можно увидеть больше деталей, а при меньших уровнях масштабирования на экране можно увидеть большую часть мира. При уровне масштабирования 0 масштаб карты таков, что ширина всего мира составляет примерно 256 точек.

Увеличение уровня масштабирования на 1 удваивает ширину мира на экране. Следовательно, при уровне масштабирования N ширина мира составляет примерно 256 * 2 N точек. Например, при уровне масштабирования 2 ширина всего мира составляет примерно 1024 точки.

Уровень масштабирования не обязательно должен быть целым числом. Диапазон уровней масштабирования, разрешенных картой, зависит от ряда факторов, включая цель, тип карты и размер экрана. Любое число вне диапазона будет преобразовано в следующее ближайшее допустимое значение, которое может быть минимальным или максимальным уровнем масштабирования. В следующем списке показан приблизительный уровень детализации, который вы можете ожидать при каждом уровне масштабирования:

  • 1: Мир
  • 5: Суша/континент
  • 10: Город
  • 15: Улицы
  • 20: Здания
На следующих изображениях показан внешний вид различных уровней масштабирования:
Скриншот карты с уровнем масштабирования 5.
Карта с уровнем масштабирования 5.
Скриншот карты при масштабе 15.
Карта с уровнем масштабирования 15.
Скриншот карты при уровне масштабирования 20.
Карта с уровнем масштабирования 20.

Установите начальное положение камеры

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

Чтобы установить исходное положение камеры, создайте объект GMSMapViewOptions и задайте для свойства camera значение GMSCameraPosition . Затем передайте свои параметры удобному конструктору GMSMapView .

Быстрый 

let options = GMSMapViewOptions()
options.camera = GMSCameraPosition.camera(withLatitude: -33.8683, longitude: 151.2086, zoom: 16)
let mapView = GMSMapView(options:options)

Цель-C 

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                        longitude:151.2086
                                                             zoom:16];
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

Вы также можете создать объект GMSMapView используя метод инициализации UIView по умолчанию. В этом случае положение камеры начинается с местоположения по умолчанию, и вы меняете его после создания.

Быстрый 

let options = GMSMapViewOptions()
options.frame = self.view.bounds
let mapView = GMSMapView(options:options)

Цель-C 

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.frame = self.view.bounds;
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

Изменить положение камеры

Вы можете программно изменить положение камеры, чтобы задать местоположение, направление, наклон и масштаб. Хотя GMSMapView предоставляет несколько методов, которые можно использовать для изменения положения камеры, обычно вы используете GMSCameraPosition или GMSCameraUpdate :

  • GMSCameraPosition содержит свойства и методы, которые вы используете для изменения каждого параметра положения камеры: цели, направления, наклона и масштабирования.

  • GMSCameraUpdate позволяет изменять цель, направление, наклон и масштаб, а также содержит дополнительные удобные методы для поддержки прокрутки, расширенного масштабирования, центрирования камеры в заранее определенных границах и многого другого.

Когда вы перемещаете камеру, вы можете «привязать» камеру к новому положению, что означает отсутствие анимации, или анимировать перемещение. Например, если вы анимируете изменение целевого местоположения камеры, анимация перемещается от предыдущего местоположения к новому.

Анимация интерполирует текущие атрибуты камеры и новые атрибуты камеры. Вы можете управлять длительностью анимации с помощью Core Animation .

Используйте GMSCameraPosition

Чтобы изменить камеру с помощью GMSCameraPosition , вы создаете новый объект или копируете существующий объект, а затем устанавливаете его в объекте GMSMapView . Используйте объект GMSCameraPosition , чтобы привязать камеру к новому местоположению с анимацией или без нее.

Используйте объект GMSCameraPosition для настройки любых свойств камеры, таких как широта, долгота, масштаб, направление и угол обзора. Затем вы используете этот объект для установки свойства camera GMSMapView .

Быстрый 

let fancy = GMSCameraPosition(
  latitude: -33,
  longitude: 151,
  zoom: 6,
  bearing: 270,
  viewingAngle: 45
)
mapView.camera = fancy

Цель-C 

GMSCameraPosition *fancy = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                       longitude:151.2086
                                                            zoom:6
                                                         bearing:30
                                                    viewingAngle:45];
[mapView setCamera:fancy];

Опустите любое свойство GMSCameraPosition , для которого вы хотите установить значение по умолчанию.

Чтобы анимировать перемещение, используйте метод animateToCameraPosition: вместо установки свойства camera .

Используйте GMSCameraUpdate

GMSCameraUpdate позволяет обновить положение камеры и выбрать, следует ли привязывать его к этому новому положению или анимировать его. Преимущество GMSCameraUpdate — удобство. Вы можете использовать GMSCameraPosition для выполнения тех же задач, что и GMSCameraUpdate , но GMSCameraUpdate предоставляет дополнительные вспомогательные методы, упрощающие управление камерой.

Например, чтобы использовать GMSCameraPosition для увеличения текущего уровня масштабирования, вам необходимо сначала определить текущий уровень масштабирования, а затем создать объект GMSCameraPosition в котором вы устанавливаете масштаб на значение, большее, чем текущий масштаб.

Альтернативно создайте объект GMSCameraUpdate с помощью метода zoomIn: :. Затем обновите камеру, передав объект GMSCameraUpdate в метод animateWithCameraUpdate: GMSMapView .

Быстрый 

// Zoom in one zoom level
let zoomCamera = GMSCameraUpdate.zoomIn()
mapView.animate(with: zoomCamera)

Цель-C 

// Zoom in one zoom level
GMSCameraUpdate *zoomCamera = [GMSCameraUpdate zoomIn];
[mapView animateWithCameraUpdate:zoomCamera];

Вместо этого используйте метод moveCamera: GMSMapView , чтобы привязать камеру к новому положению.

В следующем примере вы используете GMSCameraUpdate для анимации перемещения камеры по центру Ванкувера.

Быстрый 

// Center the camera on Vancouver, Canada
let vancouver = CLLocationCoordinate2D(latitude: 49.26, longitude: -123.11)
let vancouverCam = GMSCameraUpdate.setTarget(vancouver)
mapView.animate(with: vancouverCam)

Цель-C 

// Center the camera on Vancouver, Canada
CLLocationCoordinate2D vancouver = CLLocationCoordinate2DMake(49.26, -123.11);
GMSCameraUpdate *vancouverCam = [GMSCameraUpdate setTarget:vancouver];
[mapView animateWithCameraUpdate:vancouverCam];

Создайте объект GMSCameraUpdate

Создайте объект GMSCameraUpdate , используя один из его методов.

zoomIn: и zoomOut:
Измените текущий уровень масштабирования на 1,0, сохранив при этом все остальные свойства.
zoomTo:
Изменяет уровень масштабирования на заданное значение, сохраняя при этом все остальные свойства.
zoomBy:
Увеличивает (или уменьшает, если значение отрицательное) уровень масштабирования на заданное значение.
zoomBy:atPoint:
Увеличивает (или уменьшает, если значение отрицательное) уровень масштабирования на заданное значение, сохраняя при этом положение указанной точки на экране.
setTarget:
Изменяет широту и долготу камеры, сохраняя при этом все остальные свойства.
setTarget:zoom:
Изменяет широту, долготу и масштаб камеры, сохраняя при этом все остальные свойства.
setCamera:
Устанавливает новый GMSCameraPosition .
scrollByX:Y:
Изменяет широту и долготу камеры, чтобы переместить карту на указанное количество точек. Положительное значение x заставляет камеру двигаться вправо, так что карта кажется сдвинутой влево. Положительное значение y заставляет камеру двигаться вниз, поэтому кажется, что карта переместилась вверх. Прокрутка осуществляется относительно текущего направления камеры. Например, если камера имеет азимут 90 градусов, то восток — это «вверх».
fitBounds:
Преобразует камеру так, чтобы центрировать указанные границы на экране при максимально возможном уровне масштабирования. Применяет заполнение по умолчанию к границам 64 точек.
fitBounds:withPadding:
Преобразует камеру так, чтобы центрировать указанные границы на экране при максимально возможном уровне масштабирования. Используйте этот метод, чтобы указать одинаковые отступы в точках для всех сторон ограничивающей рамки.
fitBounds:withEdgeInsets:
Преобразует камеру так, чтобы центрировать указанные границы на экране при максимально возможном уровне масштабирования. С помощью UIEdgeInsets вы указываете отступы для каждой стороны ограничивающего прямоугольника независимо.

Используйте GMSMapView для изменения одного свойства

GMSMapView предоставляет несколько методов, позволяющих перемещать камеру без использования объекта GMSCameraPosition или объекта GMSCameraUpdate . С помощью этих методов, таких как animateToLocation: или animateToZoom: вы можете анимировать изменение одного свойства камеры.

Например, используйте метод toViewingAngle: для анимации изменения наклона камеры.

Быстрый 

mapView.animate(toViewingAngle: 45)

Цель-C 

[mapView animateToViewingAngle:45];

Установить цель (местоположение)

Местоположение определяет центр карты. Местоположение указывается по широте и долготе и представлено программно с помощью CLLocationCoordinate2D , созданного с помощью CLLocationCoordinate2DMake .

Используйте GMSCameraPosition чтобы изменить местоположение. В этом примере карта привязывается к новому местоположению.

Быстрый 

let target = CLLocationCoordinate2D(latitude: -33.868, longitude: 151.208)
mapView.camera = GMSCameraPosition(target: target, zoom: 6)

Цель-C 

CLLocationCoordinate2D target =
    CLLocationCoordinate2DMake(-33.868, 151.208);
mapView.camera = [GMSCameraPosition cameraWithTarget:target zoom:6];

Чтобы анимировать изменение и переместить карту в новое местоположение, вы можете использовать метод animateToCameraPosition: вместо установки свойства camera . Или используйте метод animateToLocation: в GMSMapView .

Быстрый 

mapView.animate(toLocation: CLLocationCoordinate2D(latitude: -33.868, longitude: 151.208))

Цель-C 

[mapView animateToLocation:CLLocationCoordinate2DMake(-33.868, 151.208)];

Вы также можете создать объект GMSCameraUpdate для перемещения камеры. Используйте его встроенный метод scrollByX:Y: , чтобы указать количество точек для прокрутки камеры в направлениях X и Y. В этом примере вы прокручиваете камеру на 200 пунктов вправо и на 100 пунктов вниз:

Быстрый 

// Move the camera 200 points to the right, and 100 points downwards
let downwards = GMSCameraUpdate.scrollBy(x: 200, y: 100)
mapView.animate(with: downwards)

Цель-C 

// Move the camera 200 points to the right, and 100 points downwards
GMSCameraUpdate *downwards = [GMSCameraUpdate scrollByX:200.0 Y:100.0];
[mapView animateWithCameraUpdate:downwards];

Установить подшипник (ориентацию)

Азимут — это направление по компасу, измеряемое в градусах от истинного севера для верхнего края карты. Например, при повороте на 90 градусов верхний край карты будет указывать строго на восток.

Установите направление программно с помощью GMSCameraPosition или GMSCameraUpdate или с помощью метода animateToBearing: GMSMapView .

Быстрый 

mapView.animate(toBearing: 0)

Цель-C 

[mapView animateToBearing:0];

Установить наклон (угол обзора)

Угол обзора — это положение камеры на дуге между центром карты и поверхностью Земли, измеряемое в градусах от надира (направления, указывающего прямо под камерой). При изменении угла обзора карта отображается в перспективе: объекты между камерой и положением карты кажутся пропорционально крупнее, а объекты за пределами положения карты — пропорционально меньше, создавая трехмерный эффект.

Угол обзора может варьироваться от 0 (направлен прямо вниз на карту) до максимума, зависящего от уровня масштабирования. Для уровня масштабирования 16 или выше максимальный угол составляет 65 градусов. Для уровня масштабирования 10 или ниже максимальный угол составляет 30 градусов.

Установите угол обзора программно с помощью GMSCameraPosition или GMSCameraUpdate или с помощью метода animateToViewingAngle: GMSMapView .

Быстрый 

mapView.animate(toViewingAngle: 45)

Цель-C 

[mapView animateToViewingAngle:45];

Установить масштаб

Уровень масштабирования камеры определяет масштаб карты. При более высоких уровнях масштабирования вы можете увидеть больше деталей на экране, а при меньших уровнях масштабирования вы можете увидеть большую часть мира.

Установите масштаб программно с помощью GMSCameraPosition или GMSCameraUpdate или с помощью метода animateToZoom: GMSMapView .

Быстрый 

mapView.animate(toZoom: 12)

Цель-C 

[mapView animateToZoom:12];

В следующем примере используется метод zoomIn: для создания объекта GMSCameraUpdate для анимации увеличения масштаба на один уровень по сравнению с текущим уровнем.

Быстрый 

// Zoom in one zoom level
let zoomCamera = GMSCameraUpdate.zoomIn()
mapView.animate(with: zoomCamera)

Цель-C 

// Zoom in one zoom level
GMSCameraUpdate *zoomCamera = [GMSCameraUpdate zoomIn];
[mapView animateWithCameraUpdate:zoomCamera];

Установите границы

Чтобы переместить камеру так, чтобы вся область интереса была видна при максимально возможном уровне масштабирования, установите границы обзора камеры. Например, если вы хотите отобразить все заправочные станции в радиусе пяти миль от текущего положения пользователя, переместите камеру так, чтобы все они были видны на экране:

  1. Рассчитайте GMSCoordinateBounds , которые вы хотите видеть на экране.
  2. Используйте cameraForBounds:insets: метод GMSMapView чтобы вернуть новый GMSCameraPosition .

Установка этих границ гарантирует, что данный GMSCoordinateBounds полностью вписывается в размер текущей карты. Обратите внимание, что этот метод устанавливает наклон и направление карты равными 0.

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

Быстрый 

let vancouver = CLLocationCoordinate2D(latitude: 49.26, longitude: -123.11)
let calgary = CLLocationCoordinate2D(latitude: 51.05,longitude: -114.05)
let bounds = GMSCoordinateBounds(coordinate: vancouver, coordinate: calgary)
let camera = mapView.camera(for: bounds, insets: UIEdgeInsets())!
mapView.camera = camera

Цель-C 

CLLocationCoordinate2D vancouver = CLLocationCoordinate2DMake(49.26, -123.11);
CLLocationCoordinate2D calgary = CLLocationCoordinate2DMake(51.05, -114.05);
GMSCoordinateBounds *bounds =
    [[GMSCoordinateBounds alloc] initWithCoordinate:vancouver coordinate:calgary];
GMSCameraPosition *camera = [mapView cameraForBounds:bounds insets:UIEdgeInsetsZero];
mapView.camera = camera;

Ограничить панорамирование пользователя определенной областью

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

Например, розничное приложение для торгового центра или аэропорта может захотеть ограничить карту определенными границами, позволяя пользователям прокручивать и перемещаться в этих границах.

Чтобы ограничить панорамирование определенными границами, установите для свойства cameraTargetBounds объекта GMSMapView объект GMSCoordinateBounds , который определяет необходимые границы. Чтобы позже снять ограничение, установите для cameraTargetBounds значение nil.

Быстрый 

mapView.cameraTargetBounds = bounds

Цель-C 

mapView.cameraTargetBounds = bounds;

На следующей диаграмме показан сценарий, когда цель камеры ограничена областью, немного превышающей область просмотра. Пользователь может осуществлять прокрутку и панорамирование при условии, что объект камеры остается в пределах ограниченной области. Крест представляет цель камеры:

Диаграмма, показывающая границы камеры, размер которых превышает окно просмотра.

Карта всегда заполняет область просмотра, даже если в результате в области просмотра отображаются области, находящиеся за пределами определенных границ. Например, если вы расположите цель камеры в углу ограниченной области, область за углом будет видна в окне просмотра, но пользователи не смогут прокручивать дальше в эту область. Следующая диаграмма иллюстрирует этот сценарий. Крест представляет цель камеры:

Диаграмма, показывающая цель камеры, расположенную в правом нижнем углу граница камеры.

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

Диаграмма, показывающая границы камеры, меньшие, чем окно просмотра.

Установите минимальный или максимальный масштаб

Глобальные константы kGMSMinZoomLevel и kGMSMaxZoomLevel определяют минимальное или максимальное значения масштабирования. По умолчанию для свойств minZoom и maxZoom GMSMapView установлены эти константы.

Чтобы ограничить диапазон уровней масштабирования, доступных для карты, установите минимальный и максимальный уровень масштабирования. Следующий код ограничивает уровень масштабирования от 10 до 15.

Быстрый 

let camera = GMSCameraPosition(
  latitude: 41.887,
  longitude: -87.622,
  zoom: 12
)
let mapView = GMSMapView(frame: .zero, camera: camera)
mapView.setMinZoom(10, maxZoom: 15)

Цель-C 

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:41.887
                                                       longitude:-87.622
                                                             zoom:12];
GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero
                                        camera:camera];
[mapView setMinZoom:10 maxZoom:15];

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

Быстрый 

mapView.setMinZoom(12, maxZoom: mapView.maxZoom)

Цель-C 

[mapView setMinZoom:12 maxZoom:mapView.maxZoom];

Если после обновления минимального и максимального масштаба уровень масштабирования камеры установлен на значение, выходящее за пределы нового диапазона, текущий масштаб автоматически обновляется для отображения ближайшего допустимого значения. Например, в следующем коде исходный масштаб определяется как 4. Когда позже диапазон масштабирования устанавливается на 10–15, текущий масштаб обновляется до 10.

Быстрый 

// Sets the zoom level to 4.
let camera2 = GMSCameraPosition(
  latitude: 41.887,
  longitude: -87.622,
  zoom: 4
)
let mapView2 = GMSMapView(frame: .zero, camera: camera)

// The current zoom, 4, is outside of the range. The zoom will change to 10.
mapView.setMinZoom(10, maxZoom: 15)

Цель-C 

// Sets the zoom level to 4.
GMSCameraPosition *camera2 = [GMSCameraPosition cameraWithLatitude:41.887
                                                         longitude:-87.622
                                                              zoom:4];
GMSMapView *mapView2 = [GMSMapView mapWithFrame:CGRectZero
                                         camera:camera];
// The current zoom, 4, is outside of the range. The zoom will change to 10.
[mapView setMinZoom:10 maxZoom:15];