Znaczniki

Wybierz platformę: Android iOS JavaScript

Znaczniki wskazują pojedyncze lokalizacje na mapie.

Domyślnie znaczniki mają standardową ikonę, która wygląda i działa jak Mapy Google. Jeśli chcesz dostosować znacznik, możesz zmienić jego kolor, zastąpić nim ikonę niestandardową lub zmienić inne właściwości znacznika.

W odpowiedzi na zdarzenie kliknięcia znacznika możesz otworzyć okno informacyjne. Okno informacyjne wyświetla tekst lub obrazy w wyskakującym okienku nad znacznikiem. Możesz użyć domyślnego okna informacyjnego, aby wyświetlać tekst, lub utworzyć własne okno informacyjne, aby całkowicie kontrolować jego zawartość.

Dodawanie znacznika

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

Poniższy przykład pokazuje, jak dodać znacznik do istniejącego obiektu GMSMapView. Znacznik jest tworzony we współrzędnej 10,10. Po kliknięciu wyświetla się ciąg znaków „Hello world”.

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;
      

Aby animować dodawanie nowych znaczników do mapy, ustaw właściwość marker.appearAnimation na:

• kGMSMarkerAnimationPop, aby znacznik wyskakiwał z groundAnchor po dodaniu.
• kGMSMarkerAnimationFadeIn, aby znacznik zniknął po dodaniu.

Usuwanie znacznika

Znacznik możesz usunąć z mapy, ustawiając we właściwości map właściwości GMSMarker wartość nil. Możesz też usunąć wszystkie nakładki (w tym znaczniki) z mapy, możesz też wywołać 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 dodać znacznik po dodaniu go do mapy, pamiętaj, aby trzymać obiekt GMSMarker. Znacznik możesz później modyfikować, modyfikując ten obiekt.

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 zmienić kolor domyślnego obrazu znacznika, poproś o zabarwienie wersji domyślnej ikony 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ą, korzystając z właściwości icon lub iconView znacznika.

Jeśli jest ustawiona wartość iconView, interfejs API ignoruje właściwość icon. Aktualizacje do bieżącego icon nie będą rozpoznawane, dopóki ustawiony jest iconView.

Korzystanie z właściwości „icon” znacznika

Ten fragment kodu tworzy znacznik z ikoną niestandardową, która jest udostępniana jako właściwość UIImage we właściwości icon. Ikona znajduje się w centrum Londynu. Fragment 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, użyj tego samego wystąpienia UIImage dla każdego znacznika. Poprawia to wydajność aplikacji, gdy wyświetla się wiele znaczników.

Ten obraz może mieć wiele klatek. Uwzględniana jest też właściwość alignmentRectInsets, co przydaje się, gdy znacznik ma cień lub inny nieodpowiedni obszar.

Korzystanie z właściwości „iconView” znacznika

Ten fragment kodu tworzy znacznik z ikoną niestandardową, konfigurując właściwość iconView i animuje zmianę koloru znacznika. 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
      

Ponieważ iconView akceptuje zasadę UIView, możesz mieć hierarchię standardowych elementów sterujących definiujących znaczniki, a każdy widok ma standardowy zestaw animacji. Możesz zmieniać rozmiar znaczników, kolor i poziom alfa, a także stosować przekształcenia. Właściwość iconView obsługuje animacje wszystkich właściwości animacji UIView z wyjątkiem frame i center.

Podczas korzystania z iconView weź pod uwagę te kwestie:

• UIView może wymagać zasobów, gdy tracksViewChanges ma wartość YES, co może zwiększyć wykorzystanie baterii. Z kolei pojedyncza ramka UIImage jest statyczna i nie trzeba jej ponownie renderować.
• Niektóre urządzenia mogą mieć problemy z renderowaniem mapy, jeśli na ekranie jest wiele znaczników, a każdy z nich ma swój własny UIView, przy czym wszystkie znaczniki śledzą jednocześnie zmiany.
• iconView nie odpowiada na interakcje użytkownika, ponieważ jest migawką danego widoku.
• Widok działa tak, jakby ustawienie clipsToBounds było ustawione na YES, niezależnie od wartości rzeczywistej. Możesz zastosować przekształcenia, które działają poza granicami obiektu, ale rysowany obiekt musi mieścić się w granicach obiektu. Wszystkie przekształcenia/przesunięcia są monitorowane i stosowane. Krótko mówiąc, widok podrzędny musi być w nim zawarty.

Aby zdecydować, kiedy ustawić właściwość tracksViewChanges, musisz wziąć pod uwagę kwestie związane ze skutecznością i zalety automatycznego redagowania znacznika. Na przykład:

• Jeśli musisz wprowadzić serię zmian, możesz zmienić właściwość na YES, a następnie z powrotem na NO.
• Gdy trwa animacja lub treść jest wczytywana asynchronicznie, należy ustawić właściwość YES do momentu zakończenia działań.

Zmiana przezroczystości znacznika

Przezroczystość znacznika możesz kontrolować za pomocą właściwości opacity. Przezroczystość powinna być określona jako liczba zmiennoprzecinkowa od 0,0 do 1,0, gdzie 0 oznacza pełną przezroczystość, a 1 – pełną nieprzezroczystość.

Swift

marker.opacity = 0.6
      

Objective-C

marker.opacity = 0.6;
      

Przezroczystość znacznika możesz animować za pomocą animacji głównej za pomocą GMSMarkerLayer.

Spłaszczanie znacznika

Ikony znaczników są zwykle rysowane na ekranie urządzenia, a nie na powierzchni mapy, więc ich obrót, pochylenie lub powiększenie nie musi wcale zmieniać orientacji znacznika.

Możesz ustawić orientację znacznika w taki sposób, aby była płaska względem ziemi. Znaczniki płaskie obracają się po obróceniu mapy i zmieniają perspektywę, gdy mapa jest przechylona. Tak jak zawsze w przypadku zwykłych znaczników, płaskie znaczniki zachowują rozmiar po 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

Znacznik możesz obrócić wokół punktu zakotwiczenia, ustawiając właściwość rotation. Określ typ obrotu jako typ CLLocationDegrees, mierzony w stopniach zgodnie z ruchem domyślnym. Kiedy znacznik jest płaski na mapie, domyślnie ustawiona jest pozycja północ.

W poniższym przykładzie znacznik jest obracany o 90°. Ustawienie właściwości groundAnchor na 0.5,0.5 powoduje, że znacznik jest obrócony wokół jego środka, a nie jego 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ń na znacznikach

Możesz nasłuchiwać zdarzeń występujących na mapie, np. gdy użytkownik dotknie znacznika. Aby nasłuchiwać zdarzeń, musisz wdrożyć protokół GMSMapViewDelegate. Zobacz przewodnik po zdarzeniach i listę metod na GMSMapViewDelegate. W przypadku wydarzeń Street View zobacz GMSPanoramaViewDelegate.