Gli indicatori segnalano singole posizioni sulla mappa.
Per impostazione predefinita, gli indicatori utilizzano un'icona standard con l'aspetto e il design comune di Google Maps. Per personalizzare l'indicatore, puoi modificare il colore dell'indicatore predefinito, sostituire l'immagine dell'indicatore con un'icona personalizzata o modificare altre proprietà dell'indicatore.
In risposta a un evento di clic su un indicatore, puoi aprire una finestra informativa. Una finestra informativa mostra testo o immagini in una finestra di dialogo sopra l'indicatore. Puoi utilizzare una finestra informativa predefinita per visualizzare il testo o creare una finestra informativa personalizzata per controllarne completamente i contenuti.
Aggiunta di un indicatore
Per aggiungere un indicatore, crea un oggetto GMSMarker
che includa position
e
title
e imposta i suoi map
.
L'esempio seguente mostra come aggiungere un indicatore a un oggetto GMSMapView
esistente. L'indicatore viene creato nelle coordinate 10,10
e, quando viene fatto clic, mostra la stringa "Hello world" in una finestra informativa.
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;
Puoi animare l'aggiunta di nuovi indicatori alla mappa impostando la
proprietà marker.appearAnimation
su:
kGMSMarkerAnimationPop
per far scoppiare l'indicatore dalla suagroundAnchor
quando viene aggiunto.kGMSMarkerAnimationFadeIn
per far scomparire l'indicatore quando viene aggiunto.
Rimozione di un indicatore
Puoi rimuovere un indicatore dalla mappa impostando la proprietà map
di
GMSMarker
su nil
. In alternativa, puoi rimuovere tutti gli overlay
(inclusi gli indicatori) attualmente sulla mappa chiamando il metodo clear
GMSMapView
.
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];
Se vuoi apportare modifiche a un indicatore dopo averlo aggiunto alla mappa,
assicurati di tenere premuto l'oggetto GMSMarker
. Puoi modificare l'indicatore in un secondo momento apportando modifiche a questo oggetto.
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;
Modifica del colore dell'indicatore
Puoi personalizzare il colore dell'immagine dell'indicatore predefinito richiedendo una versione colorata dell'icona predefinita con markerImageWithColor:
e passando l'immagine risultante alla proprietà dell'icona di GMSMarker
.
Swift
marker.icon = GMSMarker.markerImage(with: .black)
Objective-C
marker.icon = [GMSMarker markerImageWithColor:[UIColor blackColor]];
Personalizzazione dell'immagine dell'indicatore
Se vuoi modificare l'immagine dell'indicatore predefinito, puoi impostare un'icona personalizzata utilizzando
la proprietà icon
o iconView
dell'indicatore. Se il criterio iconView
viene impostato, l'API
ignora la proprietà icon
.
Utilizzo della proprietà icon
dell'indicatore
Il seguente snippet crea un indicatore con un'icona personalizzata fornita come
UIImage
nella proprietà icon
. L'icona è al centro di Londra, Inghilterra. Lo snippet presuppone che la tua applicazione contenga un'immagine denominata "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;
Se stai creando più indicatori con la stessa immagine, utilizza la stessa istanza
di UIImage
per ciascuno degli indicatori. Ciò consente di migliorare le prestazioni
dell'applicazione quando mostri molti indicatori.
Questa immagine può avere più frame. Inoltre, viene rispettata la proprietà alignmentRectInsets
, che è utile se un indicatore ha un'ombra o un'altra area inutilizzabile.
Utilizzo della proprietà iconView
dell'indicatore
Il seguente snippet crea un indicatore con un'icona personalizzata impostando la proprietà iconView
dell'indicatore e anima una modifica del colore dell'indicatore.
Lo snippet presuppone che l'applicazione contenga un'immagine denominata "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
Poiché iconView
accetta UIView
, puoi avere una gerarchia di controlli UI standard che definiscono gli indicatori, e ogni visualizzazione dispone dell'insieme standard di funzionalità di animazione. Puoi includere modifiche alla dimensione, al colore e ai livelli alpha dell'indicatore, nonché applicare trasformazioni arbitrarie. La proprietà iconView
supporta l'animazione di tutte le proprietà animabili di UIView
, tranne frame
e
center
.
Quando utilizzi iconView
, tieni presente le seguenti considerazioni:
UIView
può consumare risorse quando il criteriotracksViewChanges
è impostato suYES
, il che potrebbe comportare un aumento dell'utilizzo della batteria. In confronto, un singolo frameUIImage
è statico e non deve essere sottoposto di nuovo a rendering.- Alcuni dispositivi potrebbero avere difficoltà a eseguire il rendering della mappa se sullo schermo sono presenti molti indicatori, ognuno dei quali ha il proprio
UIView
e tutti gli indicatori stanno monitorando le modifiche contemporaneamente. - Un
iconView
non risponde all'interazione dell'utente, poiché è un'istantanea della vista. - La visualizzazione si comporta come se
clipsToBounds
fosse impostato suYES
, indipendentemente dal suo valore effettivo. Puoi applicare trasformazioni che funzionano al di fuori dei limiti, ma l'oggetto disegnato deve essere entro i limiti dell'oggetto. Tutte le trasformazioni/le trasformazioni vengono monitorate e applicate. In breve: le visualizzazioni secondarie devono essere contenute all'interno della vista.
Per decidere quando impostare la proprietà tracksViewChanges
, devi valutare le prestazioni sulle prestazioni rispetto ai vantaggi del fatto che l'indicatore venga ridisegnato automaticamente. Ad esempio:
- Se devi apportare una serie di modifiche, puoi impostare la proprietà su
YES
e poi di nuovo suNO
. - Quando è in esecuzione un'animazione o i contenuti vengono caricati
in modo asincrono, devi mantenere la proprietà impostata su
YES
fino al completamento delle azioni.
Modifica dell'opacità dell'indicatore
Puoi controllare l'opacità di un indicatore con la proprietà opacity
. Devi
specificare l'opacità come un numero in virgola mobile compreso tra 0,0 e 1,0, dove 0 è completamente trasparente
e 1 è completamente opaco.
Swift
marker.opacity = 0.6
Objective-C
marker.opacity = 0.6;
Puoi animare l'opacità dell'indicatore con [Core Animation]Core
Animation utilizzando GMSMarkerLayer
.
Appiattimento di un indicatore
Le icone degli indicatori sono in genere disegnate orientate verso lo schermo del dispositivo anziché sulla superficie della mappa, pertanto la rotazione, l'inclinazione o lo zoom della mappa non modifica necessariamente l'orientamento dell'indicatore.
Puoi impostare l'orientamento di un indicatore in modo che sia allineato alla terra. Gli indicatori piatti ruotano quando la mappa viene ruotata e cambiano prospettiva quando la mappa viene inclinata. Come per gli indicatori normali, gli indicatori piatti mantengono le loro dimensioni quando la mappa aumenta o diminuisce lo zoom.
Per modificare l'orientamento dell'indicatore, imposta la proprietà flat
dell'indicatore su
YES
o 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;
Rotazione di un indicatore
Puoi ruotare un indicatore intorno al suo punto di ancoraggio impostando la proprietà
rotation
. Specifica la rotazione di tipo CLLocationDegrees
, misurata in
gradi in senso orario rispetto alla posizione predefinita. Quando l'indicatore è piatto sulla mappa,
la posizione predefinita è Nord.
Nell'esempio seguente, l'indicatore ruota di 90°. Se imposti la proprietà groundAnchor
su 0.5,0.5
, l'indicatore viene ruotato attorno al centro anziché
alla base.
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;
Gestione degli eventi sugli indicatori
Puoi ascoltare gli eventi che si verificano sulla mappa, ad esempio quando un utente tocca un
indicatore. Per ascoltare gli eventi, devi implementare il protocollo GMSMapViewDelegate
. Consulta gli eventi e i gesti degli indicatori per scoprire come gestire eventi specifici degli indicatori. La guida agli eventi fornisce inoltre un elenco di
metodi su GMSMapViewDelegate. Per gli eventi di Street View, visita la pagina
GMSPanoramaViewDelegate
.