Эта страница переведена с помощью Cloud Translation API.

Маркеры

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

Маркеры обозначают отдельные места на карте.

По умолчанию маркеры используют стандартный значок, который имеет общий дизайн и функции Google Карт. Если вы хотите настроить маркер, вы можете изменить цвет маркера по умолчанию, заменить изображение маркера на собственный значок или изменить другие свойства маркера.

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

Добавление маркера

Чтобы добавить маркер, создайте объект GMSMarker , включающий position и title , а также задайте его map .

В следующем примере показано, как добавить маркер к существующему объекту GMSMapView . Маркер создаётся в точке с координатами 10,10 и при щелчке по нему в информационном окне отображается строка «Hello world».

Быстрый

let position = CLLocationCoordinate2D(latitude: 10, longitude: 10)
let marker = GMSMarker(position: position)
marker.title = "Hello World"
marker.map = mapView

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10);
GMSMarker *marker = [GMSMarker markerWithPosition:position];
marker.title = @"Hello World";
marker.map = mapView;

Вы можете анимировать добавление новых маркеров на карту, установив для marker.appearAnimation значение:

kGMSMarkerAnimationPop — чтобы заставить маркер выскочить из groundAnchor при добавлении.
kGMSMarkerAnimationFadeIn — позволяет плавно проявлять маркер при добавлении.

Удаление маркера

Вы можете удалить маркер с карты, установив свойство map объекта GMSMarker в значение nil . Кроме того, вы можете удалить все текущие наложения (включая маркеры) на карте, вызвав метод clear объекта GMSMapView .

Быстрый

let camera = GMSCameraPosition.camera(
  withLatitude: -33.8683,
  longitude: 151.2086,
  zoom: 6
)
let mapView = GMSMapView.map(withFrame: .zero, camera: camera)
// ...
mapView.clear()

Objective-C

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                        longitude:151.2086
                                                             zoom:6];
mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
// ...
[mapView clear];

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

Быстрый

let position = CLLocationCoordinate2D(latitude: 10, longitude: 10)
let marker = GMSMarker(position: position)
marker.map = mapView
// ...
marker.map = nil

Objective-C

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10);
GMSMarker *marker = [GMSMarker markerWithPosition:position];
marker.map = mapView;
// ...
marker.map = nil;

Изменение цвета маркера

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

Быстрый

marker.icon = GMSMarker.markerImage(with: .black)

Objective-C

marker.icon = [GMSMarker markerImageWithColor:[UIColor blackColor]];

Настройка изображения маркера

Если вы хотите изменить изображение маркера по умолчанию, вы можете задать собственный значок, используя свойство маркера icon или iconView . Если установлено iconView , API игнорирует свойство icon .

Использование свойства `icon` маркера

Следующий фрагмент кода создаёт маркер с пользовательским значком, заданным как UIImage в свойстве icon . Центр значка находится в Лондоне, Англия. В этом фрагменте предполагается, что ваше приложение содержит изображение с именем «house.png».

Быстрый

let positionLondon = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127)
let london = GMSMarker(position: positionLondon)
london.title = "London"
london.icon = UIImage(named: "house")
london.map = mapView

Objective-C

CLLocationCoordinate2D positionLondon = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:positionLondon];
london.title = @"London";
london.icon = [UIImage imageNamed:@"house"];
london.map = mapView;

Если вы создаёте несколько маркеров с одним и тем же изображением, используйте один и тот же экземпляр UIImage для каждого маркера. Это поможет повысить производительность приложения при отображении большого количества маркеров.

Это изображение может содержать несколько кадров. Кроме того, учитывается свойство alignmentRectInsets , что полезно, если у маркера есть тень или другая неиспользуемая область.

Использование свойства `iconView` маркера

Следующий фрагмент кода создаёт маркер с пользовательским значком, устанавливая свойство маркера iconView , и анимирует изменение цвета маркера. Предполагается, что ваше приложение содержит изображение с именем «house.png».

Быстрый

import CoreLocation
import GoogleMaps

class MarkerViewController: UIViewController, GMSMapViewDelegate {
  var mapView: GMSMapView!
  var london: GMSMarker?
  var londonView: UIImageView?

  override func viewDidLoad() {
    super.viewDidLoad()

    let camera = GMSCameraPosition.camera(
      withLatitude: 51.5,
      longitude: -0.127,
      zoom: 14
    )
    let mapView = GMSMapView.map(withFrame: .zero, camera: camera)
    view = mapView

    mapView.delegate = self

    let house = UIImage(named: "House")!.withRenderingMode(.alwaysTemplate)
    let markerView = UIImageView(image: house)
    markerView.tintColor = .red
    londonView = markerView

    let position = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127)
    let marker = GMSMarker(position: position)
    marker.title = "London"
    marker.iconView = markerView
    marker.tracksViewChanges = true
    marker.map = mapView
    london = marker
  }

  func mapView(_ mapView: GMSMapView, idleAt position: GMSCameraPosition) {
    UIView.animate(withDuration: 5.0, animations: { () -> Void in
      self.londonView?.tintColor = .blue
    }, completion: {(finished) in
      // Stop tracking view changes to allow CPU to idle.
      self.london?.tracksViewChanges = false
    })
  }
}

Objective-C

@import CoreLocation;
@import GoogleMaps;

@interface MarkerViewController : UIViewController <GMSMapViewDelegate>
@property (strong, nonatomic) GMSMapView *mapView;
@end

@implementation MarkerViewController {
  GMSMarker *_london;
  UIImageView *_londonView;
}

- (void)viewDidLoad {
  [super viewDidLoad];

  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:51.5
                                                          longitude:-0.127
                                                               zoom:14];
  _mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
  self.view = _mapView;

  _mapView.delegate = self;

  UIImage *house = [UIImage imageNamed:@"House"];
  house = [house imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
  _londonView = [[UIImageView alloc] initWithImage:house];
  _londonView.tintColor = [UIColor redColor];

  CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
  _london = [GMSMarker markerWithPosition:position];
  _london.title = @"London";
  _london.iconView = _londonView;
  _london.tracksViewChanges = YES;
  _london.map = self.mapView;
}

- (void)mapView:(GMSMapView *)mapView idleAtCameraPosition:(GMSCameraPosition *)position {
  [UIView animateWithDuration:5.0
                   animations:^{
    self->_londonView.tintColor = [UIColor blueColor];
  }
                   completion:^(BOOL finished) {
    // Stop tracking view changes to allow CPU to idle.
    self->_london.tracksViewChanges = NO;
  }];
}

@end

Поскольку iconView принимает UIView , вы можете создать иерархию стандартных элементов управления пользовательского интерфейса, определяющих маркеры, при этом каждое представление будет обладать стандартным набором возможностей анимации. Вы можете изменять размер, цвет и уровни альфа-канала маркера, а также применять произвольные преобразования. Свойство iconView поддерживает анимацию всех анимируемых свойств UIView , кроме frame и center .

При использовании iconView обратите внимание на следующие моменты:

UIView может быть ресурсоёмким, если параметру tracksViewChanges задано значение YES , что может привести к повышенному расходу заряда батареи. Для сравнения, UIImage с одним кадром статичен и не требует повторной отрисовки.
Некоторые устройства могут испытывать трудности с отображением карты, если на экране много маркеров, каждый из которых имеет собственный UIView и все маркеры отслеживают изменения одновременно.
iconView не реагирует на взаимодействие с пользователем, поскольку представляет собой моментальный снимок представления.
Представление ведёт себя так, как будто свойство clipsToBounds имеет значение YES , независимо от его фактического значения. Вы можете применять преобразования, работающие за пределами границ, но отрисовываемый объект должен находиться внутри границ объекта. Все преобразования/сдвиги отслеживаются и применяются. Другими словами: подпредставления должны содержаться внутри представления.
Чтобы использовать -copyWithZone: для GMSMarker , необходимо сначала скопировать GMSMarker , а затем установить новый экземпляр iconView для копии. UIView не поддерживает NSCopying , поэтому он не может скопировать iconView .

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

Если вам необходимо внести ряд изменений, вы можете изменить свойство на YES а затем обратно на NO .
Когда анимация запущена или содержимое загружается асинхронно, следует оставить свойство равным YES до завершения действий.

Изменение непрозрачности маркера

Вы можете управлять непрозрачностью маркера с помощью его свойства opacity . Значение непрозрачности должно быть задано как число с плавающей точкой в диапазоне от 0,0 до 1,0, где 0 соответствует полной прозрачности, а 1 — полной непрозрачности.

Быстрый

marker.opacity = 0.6

Objective-C

marker.opacity = 0.6;

Вы можете анимировать непрозрачность маркера с помощью Core Animation, используя GMSMarkerLayer .

Сглаживание маркера

Значки маркеров обычно рисуются с ориентацией относительно экрана устройства, а не поверхности карты, поэтому поворот, наклон или масштабирование карты не обязательно изменяют ориентацию маркера.

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

Чтобы изменить ориентацию маркера, задайте для свойства flat маркера значение YES или true .

Быстрый

let positionLondon = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127)
let londonMarker = GMSMarker(position: positionLondon)
londonMarker.isFlat = true
londonMarker.map = mapView

Objective-C

CLLocationCoordinate2D positionLondon = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *londonMarker = [GMSMarker markerWithPosition:positionLondon];
londonMarker.flat = YES;
londonMarker.map = mapView;

Вращение маркера

Вы можете вращать маркер вокруг его опорной точки, задав свойство rotation . Укажите угол поворота в типе CLLocationDegrees , измеряемый в градусах по часовой стрелке от положения по умолчанию. Когда маркер расположен на карте ровно, его положение по умолчанию — север.

В следующем примере маркер поворачивается на 90°. Установка свойства groundAnchor в 0.5,0.5 приводит к вращению маркера вокруг его центра, а не основания.

Быстрый

let degrees = 90.0
londonMarker.groundAnchor = CGPoint(x: 0.5, y: 0.5)
londonMarker.rotation = degrees
londonMarker.map = mapView

Objective-C

CLLocationDegrees degrees = 90;
londonMarker.groundAnchor = CGPointMake(0.5, 0.5);
londonMarker.rotation = degrees;
londonMarker.map = mapView;

Обработка событий на маркерах

Вы можете отслеживать события, происходящие на карте, например, касание маркера пользователем. Для отслеживания событий необходимо реализовать протокол GMSMapViewDelegate . Чтобы узнать, как обрабатывать конкретные события маркера, см. раздел «События и жесты маркера». В руководстве по событиям также представлен список методов GMSMapViewDelegate. Сведения о событиях Street View см. в разделе GMSPanoramaViewDelegate .

Маркеры Оптимизируйте свои подборки Сохраняйте и классифицируйте контент в соответствии со своими настройками.

Добавление маркера

Быстрый

Objective-C

Удаление маркера

Быстрый

Objective-C

Быстрый

Objective-C

Изменение цвета маркера

Быстрый

Objective-C

Настройка изображения маркера

Использование свойства icon маркера

Быстрый

Objective-C

Использование свойства iconView маркера

Быстрый

Objective-C

Изменение непрозрачности маркера

Быстрый

Objective-C

Сглаживание маркера

Быстрый

Objective-C

Вращение маркера

Быстрый

Objective-C

Обработка событий на маркерах

Маркеры

Использование свойства `icon` маркера

Использование свойства `iconView` маркера