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, który zapewnia niezbędne metody dodawania i usuwania innych obiektów, takich jak znaczniki i linie łamane, oraz zarządzania nimi.

Wprowadzenie

Maps SDK na iOS umożliwia wyświetlanie Mapy Google w aplikacji na iOS. Mapy te wyglądają tak samo jak mapy w aplikacji Mapy Google na iOS, a pakiet SDK udostępnia wiele tych samych funkcji.

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

Główną klasą podczas pracy z obiektem mapy jest klasa GMSMapView. Klasa GMSMapView automatycznie obsługuje te operacje:

  • łączenie z usługą Mapy Google;
  • pobieranie kart mapy;
  • wyświetlanie kart 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 oraz powiększanie lub pomniejszanie.
    • Reagowanie na gesty dwoma palcami przez przechylanie 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ępnianych przez klasę GMSMapView. Użyj GMSMapView, aby dodawać i usuwać znaczniki, nakładki na ziemię i linie łamane, zmieniać typ wyświetlanej mapy oraz kontrolować co jest wyświetlane na mapie, za pomocą klasy GMSCameraPosition.

Tworzenie map za pomocą SwiftUI

SwiftUI oferuje dodatkowy sposób tworzenia interfejsu użytkownika za pomocą podejścia deklaratywnego. Mówisz SwiftUI, jak ma wyglądać widok, oraz wszystkie jego stany, a system zajmuje się resztą. SwiftUI aktualizuje widok, gdy stan bazowy zmieni się w wyniku zdarzenia lub działania użytkownika.

Maps SDK na iOS jest zbudowany na podstawie UIKit i nie udostępnia widoku zgodnego z SwiftUI. Dodawanie map w SwiftUI wymaga zgodności z UIViewRepresentable lub UIViewControllerRepresentable. Więcej informacji znajdziesz w ćwiczeniu z programowania Dodawanie mapy do aplikacji na iOS za pomocą SwiftUI.

Dodawanie mapy

Podstawowe kroki dodawania mapy:

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

    1. Konfigurowanie w konsoli Google Cloud

    2. Używanie klucza interfejsu API

    3. Konfigurowanie projektu Xcode

    4. W pliku AppDelegate podaj klucz interfejsu API w metodzie klasy provideAPIKey: w 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 za pomocą GMSMapViewOptions. Właściwości obejmują frame, camera, mapID,backgroundColor lub screen.

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

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

    9. Ustaw obiekt GMSMapView jako widok kontrolera widoku. Na 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 dalej konfigurować obiekt GMSMapView.

Co dalej?

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