Configurare una mappa

Questa panoramica descrive come configurare una mappa aggiunta a un'app iOS utilizzando Maps SDK for iOS.

Panoramica

Dopo aver aggiunto una mappa all'app, puoi configurare le opzioni iniziali e le impostazioni di runtime della mappa. Per informazioni dettagliate sull'aggiunta di un container della mappa, vedi Aggiungere una mappa.

Le impostazioni iniziali della mappa includono:

• La posizione della videocamera, inclusi: posizione, zoom, orientamento e inclinazione. Per informazioni dettagliate sul posizionamento della videocamera, vedi Videocamera e visualizzazione.
• Il colore di sfondo della mappa .
• Il tipo di mappa.
• I componenti UI da visualizzare, ad esempio i pulsanti di zoom e la bussola.
• I gesti da attivare.

In fase di runtime puoi configurare queste impostazioni e alcune impostazioni aggiuntive aggiornando l' oggetto GMSMapView.

Opzioni della mappa

Quando inizializzi la visualizzazione della mappa, le opzioni di configurazione vengono impostate con GMSMapViewOptions. Le proprietà delle opzioni includono frame, camera, mapID o backgroundColor.

Configurare le opzioni della mappa

Puoi impostare le tue proprietà delle opzioni o passare un oggetto GMSMapViewOptions con valori predefiniti direttamente a GMSMapView.

let options = GMSMapViewOptions()
options.camera = GMSCameraPosition.camera(withLatitude: -33.8683, longitude: 151.2086, zoom: 6)
let mapView = GMSMapView(options:options)

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                        longitude:151.2086
                                                             zoom:6];
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

Ecco un esempio di passaggio di un oggetto GMSMapViewOptions con valori predefiniti direttamente a GMSMapView.

let options = GMSMapViewOptions()
let mapView = GMSMapView(options:options) //initialized with default values

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options]; //initialized with default values

Configurare il colore di sfondo

Quando lavori in modalità scura o passi da una visualizzazione della mappa all'altra, potrebbe essere utile sostituire il colore di sfondo predefinito della mappa. Puoi farlo impostando la proprietà backgroundColor delle opzioni della mappa.

let options = GMSMapViewOptions()
options.backgroundColor = UIColor.yellowColor
let mapView = GMSMapView(options:options)

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.backgroundColor = UIColor.yellowColor;
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

Tipi di mappe

Puoi personalizzare la mappa con uno dei diversi tipi di mappe. Il tipo di mappa determina la rappresentazione complessiva della mappa. Ad esempio, un atlante di solito contiene mappe politiche che si concentrano sulla visualizzazione dei confini e mappe stradali che mostrano tutte le strade di una città o di una regione. Maps SDK for iOS offre i seguenti tipi di mappe:

Modificare il tipo di mappa

Per impostare il tipo di mappa, assegna un nuovo valore alla proprietà GMSMapView.mapType. Ad esempio, per visualizzare un tipo di mappa satellitare:

let options = GMSMapViewOptions()
options.camera = GMSCameraPosition.camera(withLatitude: -33.8683, longitude: 151.2086, zoom: 6)
let mapView = GMSMapView(options:options)
mapView.mapType = .satellite

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                  longitude:151.2086
                                                        zoom:6];
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
mapView.mapType = kGMSTypeSatellite;

Il selettore di seguito mostra un confronto tra le mappe di rilievo, normali e ibride per la stessa località:

Mappe di interni

A livelli di zoom elevati, Maps SDK for iOS mostrerà le planimetrie per gli spazi interni come aeroporti, centri commerciali, grandi negozi al dettaglio e stazioni di trasporto pubblico. Le planimetrie degli interni sono integrate nelle tessere della mappa predefinite per il tipo di mappa "normale" (kGMSTypeNormal) e vengono attivate automaticamente quando l'utente aumenta lo zoom e scompaiono quando la mappa viene sottoposta a zoom out.

Puoi disattivare le mappe di interni impostando la proprietà indoorEnabled di GMSMapView su NO.

mapView.isIndoorEnabled = false
      

mapView.indoorEnabled = NO;
      

In alternativa, puoi disattivare solo il controllo Selettore piani.

Aggiungere planimetrie

Le planimetrie sono disponibili in località selezionate. Se i dati delle planimetrie non sono disponibili per un edificio che vuoi mettere in evidenza nella tua applicazione, puoi:

• Aggiungere le planimetrie direttamente a Google Maps. In questo modo, le planimetrie saranno disponibili per tutti gli utenti di Google Maps.
• Visualizzare una planimetria come overlay di base. In questo modo, solo gli utenti della tua applicazione potranno visualizzare le planimetrie.

Il livello traffico

Puoi consentire agli utenti di visualizzare la mappa con le informazioni sulla densità del traffico sovrapposte. In questo modo, avranno un riepilogo visivo della situazione del traffico locale. Puoi attivare e disattivare il livello traffico chiamando il trafficEnabled metodo. Il seguente esempio mostra come potrebbe apparire il livello traffico su una mappa.

Il livello trasporto pubblico

Maps SDK for iOS ti consente di visualizzare la rete di trasporto pubblico di una città sulla mappa utilizzando il transitEnabled metodo. Quando il livello traffico è attivo e la mappa è centrata su una città che supporta le informazioni sul trasporto pubblico, la mappa visualizzerà le principali linee di trasporto pubblico come linee spesse e colorate. Il colore della linea viene impostato in base alle informazioni fornite dall'operatore della linea di trasporto pubblico. L'attivazione del livello trasporto pubblico modificherà lo stile della mappa base per enfatizzare meglio i percorsi di trasporto pubblico.

Se sei un'agenzia pubblica che supervisiona il trasporto pubblico della tua città e vuoi che i tuoi dati vengano inclusi, visita il sito del programma Google Transit Partner Program per saperne di più.

Il seguente esempio mostra come potrebbe apparire il livello trasporto pubblico su una mappa.

Accessibilità

Per impostazione predefinita, gli elementi di accessibilità sulla mappa sono nascosti. Puoi attivare l'accessibilità impostando la proprietà accessibilityElementsHidden di GMSMapView su NO. In questo modo, gli elementi di accessibilità vengono generati per gli oggetti overlay (ad esempio GMSMarker e finestre informative, GMSPolyline e così via).

mapView.accessibilityElementsHidden = false
      

mapView.accessibilityElementsHidden = NO;
      

Questa proprietà è conforme al protocollo informale UIAccessibility, tranne per il fatto che il valore predefinito in Maps SDK for iOS è YES.

La mia posizione

Per impostazione predefinita, sulla mappa non vengono visualizzati dati sulla posizione. Puoi attivare il punto blu "La mia posizione" e la direzione della bussola impostando myLocationEnabled su GMSMapView.

mapView.isMyLocationEnabled = true
      

mapView.myLocationEnabled = YES;
      

L'attivazione di questa funzionalità fornisce la posizione attuale dell'utente tramite la proprietà myLocation. Questa proprietà potrebbe non essere disponibile immediatamente, ad esempio se all'utente viene chiesto da iOS di consentire l'accesso a questi dati. In questo caso, il valore è nil.

print("User's location: \(String(describing: mapView.myLocation))")
      

NSLog(@"User's location: %@", mapView.myLocation);
      

Edifici 3D

Molte città, se viste da vicino, avranno edifici 3D visibili, come si può vedere nell'immagine di Seattle, Washington, di seguito.

Puoi disattivare gli edifici 3D impostando la proprietà corrispondente GMSMapView in Swift o Objective-C, come mostrato di seguito:

mapView.isBuildingsEnabled = false
      

[mapView setBuildingsEnabled:NO];
      

Spaziatura interna della mappa

Una mappa di Google è progettata per riempire l'intera regione definita da GMSMapView. Diversi aspetti dell'aspetto e del comportamento della mappa sono definiti dalle dimensioni della visualizzazione:

• Il target della videocamera riflette il centro della regione con spaziatura interna.
• I controlli della mappa sono posizionati rispetto ai bordi della mappa.
• Le informazioni legali, come le dichiarazioni di copyright o il logo Google, vengono visualizzate lungo il bordo inferiore della mappa.

Puoi aggiungere una spaziatura interna intorno ai bordi della mappa utilizzando la proprietà GMSMapView.padding. La mappa continua a riempire l'intero contenitore, ma il posizionamento del testo e dei controlli, i gesti della mappa e i movimenti della videocamera si comportano come se fosse stata posizionata in uno spazio più piccolo. Di conseguenza, si verificano le seguenti modifiche:

• I movimenti della videocamera che utilizzano chiamate API o pressioni di pulsanti (ad es. bussola, la mia posizione) sono relativi alla regione con spaziatura interna.
• GMSMapView.projection restituisce una proiezione che include solo la regione con spaziatura interna.
• I controlli UI sono spostati dal bordo del container del numero di punti specificato.

La spaziatura interna può essere utile quando si progettano UI che si sovrappongono a una parte della mappa. Ad esempio, nell'immagine, la mappa ha una spaziatura interna lungo i bordi superiore e destro. I controlli della mappa e il testo legale visibili vengono visualizzati lungo i bordi della regione con spaziatura interna, mostrata in verde, mentre la mappa continua a riempire l'intero container, mostrato in blu. In questo esempio, potresti far fluttuare un menu sul lato destro della mappa senza oscurare i controlli della mappa.

Per aggiungere una spaziatura interna alla mappa, crea un oggetto UIEdgeInsets e passalo alla proprietà GMSMapView.padding.

// Insets are specified in this order: top, left, bottom, right
let mapInsets = UIEdgeInsets(top: 100.0, left: 0.0, bottom: 0.0, right: 300.0)
mapView.padding = mapInsets
      

// Insets are specified in this order: top, left, bottom, right
UIEdgeInsets mapInsets = UIEdgeInsetsMake(100.0, 0.0, 0.0, 300.0);
mapView.padding = mapInsets;
      

Combinazione di colori della mappa

Per le mappe di tipo normale e rilievo, puoi impostare la combinazione di colori della mappa su scura, chiara o in base alle impostazioni di sistema correnti. Ad esempio, puoi scurire o schiarire la combinazione di colori della mappa in base all'ora del giorno o all'utilizzo del dispositivo all'interno o all'esterno.

Utilizza GMSMapView overrideUserInterfaceStyle: per impostare e aggiornare la combinazione di colori della mappa.

let options = GMSMapViewOptions()
// Map is init to use light mode by default.
let mapView = GMSMapView(options: options)
// Set map to use dark mode.
mapView.overrideUserInterfaceStyle = .dark
// Set map to use light mode.
mapView.overrideUserInterfaceStyle = .light
// Set map to use dark/light mode based on the value of traitCollection.userInterfaceStyle
mapView.overrideUserInterfaceStyle = .unspecified

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
// Map is init to always use light mode.
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
// Set map to use dark mode.
mapView.overrideUserInterfaceStyle = UIUserInterfaceStyleDark;
// Set map to use light mode.
mapView.overrideUserInterfaceStyle = UIUserInterfaceStyleLight;
// Set map to use dark/light mode based on the value of traitCollection.userInterfaceStyle
mapView.overrideUserInterfaceStyle = UIUserInterfaceStyleUnspecified;

Per creare stili chiari e scuri personalizzati per le tue mappe, utilizza la personalizzazione delle mappe basata su cloud.