Dodawanie mapy

Wybierz platformę: Android iOS JavaScript

Mapy są reprezentowane w interfejsie API przez klasę GMSMapView, która jest podklasą klasy UIView. Mapa jest najważniejszym obiektem w pakiecie Maps SDK na iOS i udostępnia metody dodawania i usuwania innych obiektów, takich jak znaczniki i linie łamane, oraz zarządzanie nimi.

Wstęp

Pakiet Maps SDK na iOS pozwala wyświetlać mapę Google w aplikacji na iOS. Mapy wyglądają tak samo jak w aplikacji Mapy Google na iOS, a pakiet SDK udostępnia wiele z tych samych funkcji.

Oprócz funkcji mapowania interfejs API obsługuje też wiele interakcji, które są zgodne z modelem interfejsu użytkownika w iOS. Na przykład możesz skonfigurować interakcje z mapą, definiując użytkowników reagujących na gesty użytkowników, takie jak dotknięcie i dwukrotne dotknięcie.

Klasa klucza podczas pracy z obiektem Map to klasa GMSMapView. GMSMapView automatycznie obsługuje te operacje:

  • Łączę z usługą Mapy Google.
  • Pobieram fragmenty mapy.
  • Wyświetlam kafelki na ekranie urządzenia.
  • Wyświetlanie różnych elementów sterujących, takich jak przesuwanie i powiększanie.
  • Reakcja na gesty przesunięcia i powiększenia polegająca na przesuwaniu mapy oraz powiększaniu i pomniejszaniu.
    • Reagowanie na gesty 2 palcami przez przechylenie kąta wyświetlania mapy.

Oprócz tych automatycznych operacji możesz kontrolować działanie i wygląd mapy za pomocą właściwości i metod udostępnianych przez klasę GMSMapView. Klasa GMSMapView umożliwia dodawanie i usuwanie znaczników, nakładek naziemnych i linii łamanych, zmienianie typu wyświetlanej mapy oraz kontrolowanie tego, co widać na mapie dzięki klasie GMSCameraPosition.

Twórz mapy za pomocą SwiftUI

SwiftUI zapewnia dodatkowy sposób tworzenia UI przy użyciu metody deklaratywnej. Informujesz SwiftUI, jak ma wyglądać widok wraz ze wszystkimi jego stanami, a system zajmuje się resztą. SwiftUI obsługuje aktualizowanie widoku po każdej zmianie stanu bazowego w wyniku zdarzenia lub działania użytkownika.

Maps SDK na iOS opiera się na UIKit i nie zapewnia widoku zgodnego z SwiftUI. Dodawanie map w SwiftUI wymaga spełnienia warunków UIViewRepresentable lub UIViewControllerRepresentable. Więcej informacji znajdziesz w ćwiczeniach z Codelabs dotyczących dodawania mapy do aplikacji na iOS za pomocą SwiftUI.

Dodawanie mapy

Podstawowe czynności, które należy wykonać, aby dodać mapę:

  1. Aby pobrać pakiet SDK, uzyskać klucz interfejsu API i dodać wymagane platformy, wykonaj te czynności:

    1. Skonfiguruj w konsoli Google Cloud

    2. Używanie klucza interfejsu API

    3. Konfigurowanie projektu Xcode

    4. W AppDelegate podaj klucz interfejsu API metody klasy provideAPIKey: w zadaniu GMSServices.

    5. Utwórz lub zaktualizuj ViewController. Jeśli mapa jest wyświetlana, gdy ten kontroler widoku staje się widoczny, utwórz go w metodzie viewDidLoad.

    6. Podczas inicjowania widoku mapy ustaw opcje konfiguracji w GMSMapViewOptions. Dostępne właściwości to frame, camera, mapID,backgroundColor lub screen.

    7. Ustaw właściwość opcji mapy camera za pomocą obiektu GMSCameraPosition. Określa poziom powiększenia i poziomu powiększenia mapy.

    8. Utwórz i utwórz instancję klasy GMSMapView za pomocą metody GMSMapView options:. Jeśli ta mapa ma być używana jako jedyny widok kontrolera widoku, jako widok frame można użyć domyślnej wartości CGRectZero opcji mapy frame – rozmiar mapy jest zmieniany automatycznie.

    9. Ustaw obiekt GMSMapView jako widok kontrolera widoków. Przykład: self.view = mapView;.

Poniższy przykład dodaje do aplikacji mapę wyśrodkowaną na centrum Singapuru.

Swift

import GoogleMaps

class MapObjects : UIViewController {
  override func viewDidLoad() {
    super.viewDidLoad()

    let options = GMSMapViewOptions()
    options.camera = GMSCameraPosition(latitude: 1.285, longitude: 103.848, zoom: 12)
    options.frame = self.view.bounds;

    let mapView = GMSMapView(options:options)
    self.view = mapView
  }
}

Objective-C

- (void)viewDidLoad {
  [super viewDidLoad];

  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = [GMSCameraPosition cameraWithLatitude:1.285
                                                        longitude:103.848
                                                             zoom:12];
  options.frame = self.view.bounds;

  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  self.view = mapView;
}

Po wykonaniu tych czynności możesz jeszcze bardziej skonfigurować obiekt GMSMapView.

Co dalej?

Po wykonaniu tych czynności możesz skonfigurować ustawienia mapy.