Dodawanie mapy

Wybierz platformę: Android iOS JavaScript

Mapy są reprezentowane w interfejsie API przez klasę GMSMapView, która jest podklasą klasy UIView. Mapa jest najistotniejszym obiektem w pakiecie Maps SDK na iOS i zawiera niezbędne metody dodawania i usuwania innych obiektów, takich jak znaczniki i linie łamane, oraz zarządzania nimi.

Wprowadzenie

Pakiet Maps SDK na iOS umożliwia wyświetlanie mapy Google w aplikacji na iOS. Wygląd tych map jest taki sam jak w aplikacji Mapy Google na iOS, a pakiet SDK udostępnia wiele takich samych funkcji.

Oprócz funkcji mapowania interfejs API obsługuje też różne interakcje zgodne z modelem interfejsu użytkownika iOS. Możesz na przykład skonfigurować interakcje z mapą, definiując elementy reagujące na gesty użytkownika, takie jak kliknięcie i podwójne kliknięcie.

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

  • Łączenie z usługą Mapy Google.
  • Pobieranie elementów mapy.
  • wyświetlanie kafelków na ekranie urządzenia;
  • wyświetlanie różnych elementów sterujących, takich jak przesuwanie i powiększanie;
  • reagowanie na gesty przesuwania i powiększania przez przesuwanie mapy i powiększanie lub pomniejszanie widoku;
    • reagowanie na gesty 2 palcami przez pochylenie kąta widzenia mapy;

Oprócz tych automatycznych operacji możesz kontrolować zachowanie i wygląd mapy za pomocą właściwości i metod udostępnionych przez klasę GMSMapView. GMSMapView umożliwia dodawanie i usuwanie znaczników, nakładek naziemnych oraz linii złożonych, zmianę typu wyświetlanej mapy oraz kontrolowanie tego, co jest na niej widoczne, za pomocą klasy GMSCameraPosition.

Tworzenie map za pomocą SwiftUI

SwiftUI oferuje dodatkowy sposób tworzenia interfejsu użytkownika za pomocą podejścia deklaratywnego. Musisz tylko określić, jak ma wyglądać widok i jakie ma mieć stany, a system zrobi resztę. SwiftUI aktualizuje widok, gdy stan podstawowy ulega zmianie z powodu zdarzenia lub działania użytkownika.

Pakiet SDK Map na iOS jest oparty na UIKit i nie zapewnia widoku zgodnego z SwiftUI. Dodawanie map w SwiftUI wymaga zgodności z poziomem UIViewRepresentable lub UIViewControllerRepresentable. Więcej informacji znajdziesz w Codelab Dodawanie mapy do aplikacji na iOS za pomocą SwiftUI.

Dodawanie mapy

Podstawowe kroki, 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. Konfigurowanie w konsoli Google Cloud

    2. Korzystanie z klucza interfejsu API

    3. Konfigurowanie projektu Xcode

    4. W pliku AppDelegate podaj klucz interfejsu API w metodzie klasy provideAPIKey: w pliku GMSServices.

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

    6. Podczas inicjowania widoku mapy ustaw opcje konfiguracji za pomocą funkcji GMSMapViewOptions. Właściwości obejmują frame, camera, mapID,backgroundColor lub screen.

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

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

    9. Ustaw obiekt GMSMapView jako widok kontrolera widoku. Na przykład: self.view = mapView;.

W tym przykładzie do aplikacji dodawana jest mapa z centrum Singapuru w środku.

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 dostosować obiekt GMSMapView.

Co dalej?

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