Маркеры обозначают отдельные места на карте.
По умолчанию маркеры используют стандартный значок, который имеет общий внешний вид Google Maps. Если вы хотите настроить свой маркер, вы можете изменить цвет маркера по умолчанию, заменить изображение маркера пользовательским значком или изменить другие свойства маркера.
В ответ на событие щелчка по маркеру можно открыть информационное окно . В информационном окне текст или изображения отображаются в диалоговом окне над маркером. Вы можете использовать информационное окно по умолчанию для отображения текста или создать собственное информационное окно, чтобы полностью контролировать его содержимое.
Добавление маркера
Чтобы добавить маркер, создайте объект 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
Цель-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()
Цель-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
Цель-C
CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10); GMSMarker *marker = [GMSMarker markerWithPosition:position]; marker.map = mapView; // ... marker.map = nil;
Изменение цвета маркера
Вы можете настроить цвет изображения маркера по умолчанию, запросив тонированную версию значка по умолчанию с помощью markerImageWithColor:
и передав полученное изображение в свойство icon GMSMarker
.
Быстрый
marker.icon = GMSMarker.markerImage(with: .black)
Цель-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
Цель-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 }) } }
Цель-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
, независимо от его фактического значения. Вы можете применять преобразования, которые работают за пределами границ, но рисуемый объект должен находиться в пределах границ объекта. Все преобразования/сдвиги отслеживаются и применяются. Короче говоря: подпредставления должны содержаться внутри представления.
Чтобы решить, когда устанавливать свойство tracksViewChanges
, вам следует сопоставить соображения производительности с преимуществами автоматической перерисовки маркера. Например:
- Если вам нужно внести ряд изменений, вы можете изменить свойство на
YES
, а затем обратно наNO
. - Когда анимация выполняется или содержимое загружается асинхронно, для свойства следует сохранять значение
YES
до тех пор, пока действия не будут завершены.
Изменение непрозрачности маркера
Вы можете контролировать непрозрачность маркера с помощью его свойства opacity
. Вам следует указать непрозрачность в виде числа с плавающей точкой от 0,0 до 1,0, где 0 — полностью прозрачный, а 1 — полностью непрозрачный.
Быстрый
marker.opacity = 0.6
Цель-C
marker.opacity = 0.6;
Вы можете анимировать непрозрачность маркера с помощью [Core Animation] 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
Цель-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
Цель-C
CLLocationDegrees degrees = 90; londonMarker.groundAnchor = CGPointMake(0.5, 0.5); londonMarker.rotation = degrees; londonMarker.map = mapView;
Обработка событий на маркерах
Вы можете прослушивать события, происходящие на карте, например, когда пользователь касается маркера. Чтобы прослушивать события, необходимо реализовать протокол GMSMapViewDelegate
. Ознакомьтесь с событиями и жестами маркеров , чтобы узнать, как обрабатывать определенные события маркеров. В руководстве по событиям также представлен список методов GMSMapViewDelegate. Информацию о событиях просмотра улиц см. в разделе GMSPanoramaViewDelegate
.