Znaczniki

Wybierz platformę: Android iOS JavaScript

Znaczniki wskazują pojedyncze lokalizacje na mapie.

Domyślnie znaczniki używają standardowej ikony o wyglądzie i sposobie działania Map Google. Jeśli chcesz dostosować znacznik, możesz zmienić kolor domyślnego znacznika, zastąpić obraz znacznika własną ikoną lub zmienić inne właściwości znacznika.

W odpowiedzi na zdarzenie kliknięcia znacznika możesz otworzyć okno informacyjne. Nad znacznikiem w oknie informacyjnym pojawi się tekst lub obrazy. Możesz użyć domyślnego okna informacyjnego do wyświetlania tekstu lub utworzyć własne niestandardowe okno informacyjne, by całkowicie kontrolować jego zawartość.

Dodawanie znacznika

Aby dodać znacznik, utwórz obiekt GMSMarker zawierający position oraz title i ustaw jego map.

Z przykładu poniżej dowiesz się, jak dodać znacznik do istniejącego obiektu GMSMapView. Znacznik jest tworzony w miejscu o współrzędnych 10,10 i po kliknięciu wyświetla w oknie informacyjnym ciąg „Witaj świecie”.

Swift

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;
      

Możesz animować dodanie nowych znaczników do mapy, ustawiając właściwość marker.appearAnimation na:

  • kGMSMarkerAnimationPop, aby znacznik wysunął się z elementu groundAnchor po dodaniu.
  • kGMSMarkerAnimationFadeIn – powoduje zanikanie po dodaniu znacznika.

Usuwanie znacznika

Aby usunąć znacznik z mapy, ustaw właściwość map elementu GMSMarker na nil. Można też usunąć wszystkie nakładki (w tym znaczniki) widoczne obecnie na mapie, wywołując metodę GMSMapView clear.

Swift

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];
      

Jeśli chcesz zmienić znacznik po dodaniu go do mapy, trzymaj obiekt GMSMarker. Znacznik możesz później zmodyfikować, wprowadzając zmiany w tym obiekcie.

Swift

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;
      

Zmiana koloru znacznika

Aby dostosować kolor domyślnego obrazu znacznika, poproś o zabarwienie wersji domyślnej ikony za pomocą parametru markerImageWithColor: i przekaż wynikowy obraz do właściwości ikony GMSMarker.

Swift

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

Objective-C

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

Dostosowywanie obrazu znacznika

Jeśli chcesz zmienić domyślny obraz znacznika, możesz ustawić ikonę niestandardową za pomocą właściwości icon lub iconView znacznika. Jeśli ustawiona jest wartość iconView, interfejs API zignoruje właściwość icon.

Korzystanie z właściwości icon znacznika

Ten fragment kodu tworzy znacznik z niestandardową ikoną podaną jako UIImage we właściwości icon. Ikona jest pośrodku Londynu w Anglii. Fragment kodu zakłada, że aplikacja zawiera obraz o nazwie „house.png”.

Swift

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;
      

Jeśli tworzysz kilka znaczników z tym samym obrazem, dla każdego z nich użyj tego samego wystąpienia UIImage. Pomaga to zwiększyć wydajność aplikacji przy wyświetlaniu wielu znaczników.

Ten obraz może mieć wiele ramek. Dodatkowo przestrzegana jest właściwość alignmentRectInsets, co jest przydatne, gdy znacznik zawiera cień lub inny bezużyteczny region.

Korzystanie z właściwości iconView znacznika

Ten fragment kodu tworzy znacznik z niestandardową ikoną, ustawiając właściwość iconView znacznika i animuje jego zmianę. Fragment kodu zakłada, że aplikacja zawiera obraz o nazwie „house.png”.

Swift

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 akceptuje elementy UIView, dlatego możesz mieć hierarchię standardowych elementów interfejsu definiujących znaczniki. Każdy widok ma standardowy zestaw funkcji animacji. Możesz uwzględniać zmiany rozmiaru znacznika, jego koloru i wartości alfa, a także stosować dowolne przekształcenia. Właściwość iconView obsługuje animacje wszystkich możliwych do animacji właściwości UIView oprócz frame i center.

Jeśli korzystasz z iconView, weź pod uwagę te informacje:

  • UIView może wymagać zasobów, gdy tracksViewChanges ma wartość YES, co może zwiększyć wykorzystanie baterii. Dla porównania pojedyncza ramka UIImage jest statycznym i nie trzeba go ponownie renderować.
  • Jeśli na ekranie jest wyświetlanych wiele znaczników, niektóre urządzenia mogą mieć problemy z renderowaniem mapy, a każdy z nich ma własny UIView i wszystkie znaczniki śledzą zmiany w tym samym czasie.
  • Element iconView nie odpowiada na interakcję użytkownika, ponieważ jest to migawka widoku.
  • Widok zachowuje się tak, jakby clipsToBounds miał wartość YES, niezależnie od jej rzeczywistej wartości. Możesz stosować przekształcenia, które działają poza granicami, ale rysowany obiekt musi się znajdować w jego granicach. Wszystkie przekształcenia i przesunięcia są monitorowane i stosowane. Krótko mówiąc: widoki podrzędne muszą zawierać widoki podrzędne.

Podejmując decyzję, kiedy ustawić właściwość tracksViewChanges, weź pod uwagę kwestie związane z wydajnością i zaletami automatycznego ponownego rysowania znaczników. Na przykład:

  • Jeśli masz do wprowadzenia serię zmian, możesz zmienić właściwość na YES, a następnie z powrotem na NO.
  • Gdy animacja jest uruchomiona lub jej zawartość jest wczytywana asynchronicznie, pozostaw właściwość ustawioną na YES do czasu zakończenia działań.

Zmienianie przezroczystości znacznika

Przezroczystość znacznika możesz kontrolować za pomocą jego właściwości opacity. Przezroczystość należy określić w postaci liczby zmiennoprzecinkowej z zakresu od 0,0 do 1,0, gdzie 0 oznacza pełną przezroczystość, a 1 – całkowitą nieprzejrzystość.

Swift

marker.opacity = 0.6
      

Objective-C

marker.opacity = 0.6;
      

Możesz animować przezroczystość znacznika za pomocą funkcji GMSMarkerLayer Core Animation.

Spłaszczanie znacznika

Ikony znaczników są zazwyczaj rysowane zorientowane względem ekranu urządzenia, a nie powierzchni mapy, więc obracanie, pochylanie lub powiększanie mapy nie musi koniecznie zmieniać orientacji znacznika.

Możesz ustawić orientację znacznika tak, aby była płaska względem Ziemi. Płaskie znaczniki obracają się podczas obrócenia mapy i zmieniają perspektywę po jej przechyleniu. Podobnie jak w przypadku standardowych znaczników, płaskie znaczniki zachowują swój rozmiar przy powiększeniu lub pomniejszeniu mapy.

Aby zmienić orientację znacznika, ustaw jego właściwość flat na YES lub true.

Swift

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;
      

Obracanie znacznika

Możesz obrócić znacznik wokół swojego punktu zakotwiczenia, ustawiając właściwość rotation. Jako typ obrotu określ CLLocationDegrees, wyrażony w stopniach w prawo od pozycji domyślnej. Gdy znacznik znajduje się płasko na mapie, domyślną pozycją jest północ.

W przykładzie poniżej znacznik obraca się o 90°. Ustawienie właściwości groundAnchor na 0.5,0.5 powoduje, że znacznik jest obrócony wokół jego środka, a nie podstawy.

Swift

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;
      

Obsługa zdarzeń w znacznikach

Możesz nasłuchiwać zdarzeń występujących na mapie, np. gdy użytkownik kliknie znacznik. Aby wykrywać zdarzenia, musisz wdrożyć protokół GMSMapViewDelegate. Aby dowiedzieć się, jak obsługiwać określone zdarzenia związane ze znacznikami, przeczytaj o zdarzeniach i gestach związanych ze znacznikami. Przewodnik po zdarzeniach zawiera też listę metod w GMSMapViewOBJECT. Informacje o wydarzeniach Street View znajdziesz tutaj: GMSPanoramaViewDelegate.