Uygulamanıza 3D harita ekleme

Platform seçin: Android iOS JavaScript

Seattle, San Francisco ve Paris'in temel haritaları

Bu sayfada, iOS için Haritalar 3D SDK'sını kullanarak iOS uygulamasına temel bir 3D harita ekleme örneği açıklanmaktadır. Bu sayfadaki talimatlarda, Kurulum sayfasındaki adımları tamamladığınız ve aşağıdakilere sahip olduğunuz varsayılır:

  • iOS için Haritalar 3D SDK'sının etkinleştirildiği bir Google Cloud projesi
  • iOS için Haritalar 3D SDK'sı API anahtarı
  • iOS için Haritalar 3D SDK paketi eklenmiş Xcode 16.0 sürümü veya sonraki bir sürümü.

Bu ön koşullar hakkında daha fazla bilgi için Kurulum başlıklı makaleyi inceleyin.

Daha ileri düzey bir Codelab'i takip edin.

GitHub'da daha fazla kod örneği

1. bölüm: Temel bir SwiftUI uygulaması oluşturma

  1. Xcode'da yeni bir uygulama oluşturun.
  2. Ürün Adı'nı Hello3DWorld olarak ayarlayın. Kuruluş tanımlayıcısı com.example olarak ayarlanmalıdır. Paket adı com.example.Hello3DWorld olmalıdır.
  3. SwiftUI arayüzünü seçin.
  4. Haritalar 3D kitaplığını uygulamanıza ekleyin. Kurulum bölümündeki talimatlara bakın.

2. bölüm: Harita ekleme

Bir kürenin minimal 3D haritası

  1. ContentView.swift adlı dosyayı açın. Bu, uygulamanızın giriş noktası ve ana gezinme noktasıdır.

  2. SwiftUI ve GoogleMaps3D paketini içe aktarın.

  3. Gövde bildiriminin içindeki tüm kodu Map(mode: .hybrid) ile değiştirin.

    Map öğesini başlatmak için sağlamanız gereken minimum başlangıç yapılandırması MapMode'dir:

    • .hybrid veya
    • .uydu

    ContentView.swift dosyanız şu şekilde görünmelidir:

    import SwiftUI
    import GoogleMaps3D
    
    struct ContentView: View {
      var body: some View {
        Map(mode: .hybrid)
      }
    }
    
    #Preview {
      ContentView()
    }
    

3. bölüm: API anahtarınızı ayarlayın.

  1. API anahtarı, harita başlatılmadan önce ayarlanmalıdır. Bunu, Harita'yı içeren View öğesinin init() etkinlik işleyicisinde Map.apiKey değerini ayarlayarak yapın.

    import SwiftUI
    import GoogleMaps3D
    
    struct ContentView: View {
      init () {
        Map.apiKey = "YOUR_API_KEY"
      }
    
      var body: some View {
        Map(mode: .hybrid)
      }
    }
    

4. bölüm: Harita görünümünü kontrol etmek için kamera kullanma

3D Harita görünümleri Camera sınıfı tarafından kontrol edilir. Bu adımda harita görünümünü özelleştirmek için konum, yükseklik, yön, eğim, dönüş ve menzili nasıl belirleyeceğinizi öğreneceksiniz.

  1. Map() işlev çağrısını initialCamera özelliğini içerecek şekilde değiştirin. initialCamera'ı, Manhattan şehir merkezinin görünümünü gösterecek şekilde başlatın.

    import SwiftUI
    import GoogleMaps3D
    
    struct ContentView: View {
      init () {
        Map.apiKey = "YOUR_API_KEY"
      }
      var body: some View {
        Map(initialCamera: .init(
          latitude: 40.748339,
          longitude: -73.985912,
          altitude: 211.1,
          heading: 52,
          tilt: 68,
          range: 1039
        ), mode: .hybrid)
      }
    }
    

Yukarıdaki kod şu parametreler için değerleri ayarlar:

  • heading: Kameranın kuzeyden hangi yöne bakacağını gösteren derece cinsinden yön.
  • tilt: Eğme açısı (derece cinsinden). 0 değeri doğrudan yukarıyı, 90 değeri ise yatay olarak bakmayı ifade eder.
  • roll: Kameranın dikey düzlemi etrafındaki yuvarlanma açısı (derece cinsinden).
  • range: Kameranın enlem ve boylam konumuna olan mesafesi (metre cinsinden)
  • altitude: Kameranın deniz seviyesinden yüksekliği.

Bu ek parametrelerden herhangi birini sağlamazsanız varsayılan değer kullanılır.

Kamera görünümünde daha fazla 3D veri gösterilmesi için ilk parametreleri daha yakın ve eğimli bir görünüm gösterecek şekilde ayarlayın.

6. bölüm: Uygulamanızı önizleme ve çalıştırma

New York City'nin temel 3D haritası

  1. Xcode önizlemesi ekleme

    Önizlemeler, Simülatör'ü veya harici bir cihazı kullanmanıza gerek kalmadan uygulamanızı görmenize ve uygulamayla etkileşimde bulunmanıza olanak tanıyan güçlü bir Xcode özelliğidir.

    Önizleme eklemek için struct'ınızın dışına bir #Preview {} kod bloğu ekleyin.

    #Preview {
      CameraDemo()
    }
    
  2. Uygulamayı çalıştırma

Uygulamayı derleyip çalıştırın.

Tebrikler!

Bir uygulamaya 3D harita başarıyla eklendi.

Ardından, iOS için Haritalar 3D SDK'sının kamera yolu animasyonları, 3D işaretçiler veya çokgenler gibi daha gelişmiş özelliklerini keşfedebilirsiniz.