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, 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. Te mapy wyglądają tak samo jak mapy w aplikacji Mapy Google na iOS, a pakiet SDK udostępnia wiele takich 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 obiekty reagujące na gesty użytkownika, takie jak kliknięcie i dwukrotne kliknięcie.

Podstawową klasą podczas pracy z obiektem Map jest klasa GMSMapView. GMSMapView automatycznie obsługuje te operacje:

  • Łączę z usługą Map Google.
  • Pobieram kafelki 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 oraz powiększanie lub pomniejszanie widoku;
    • 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 naziemne i linie łamane, zmieniać typ wyświetlanej mapy i kontrolować, co jest wyświetlane na mapie, za pomocą klasy GMSCameraPosition.

Tworzenie map za pomocą SwiftUI

SwiftUI oferuje dodatkowy sposób tworzenia interfejsu za pomocą podejścia deklaratywnego. Wystarczy, że powiesz SwiftUI, jak ma wyglądać widok i jakie ma mieć stany, a system zajmie się resztą. SwiftUI obsługuje aktualizowanie widoku, gdy stan bazowy zmienia się w wyniku zdarzenia lub działania użytkownika.

Pakiet Maps SDK na iOS jest oparty na 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 czynności związane z dodawaniem mapy:

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

    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 obiekcie GMSServices.

    5. Utwórz lub zaktualizuj ViewController. Jeśli mapa jest wyświetlana, gdy ten kontroler widoku staje się widoczny, utwórz ją 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 środek i poziom 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, domyślna wartość opcji mapy frame (CGRectZero) może być używana jako widok frame – rozmiar mapy jest zmieniany automatycznie.

    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.