Uygulamanıza 3D harita ekleme

Platform seçin: Android iOS JavaScript

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 talimatlar, Kurulum sayfasındaki adımları tamamladığınızı ve aşağıdakilere sahip olduğunuzu varsayar:

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

Bu ön koşullar hakkında daha fazla bilgi için Kurulum bölümüne bakın.

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

GitHub'da daha fazla kod örneği inceleyin.

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

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

2. bölüm: Harita ekleme

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

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

3. Gövde beyanındaki tüm kodu Map(mode: .hybrid) ile değiştirin.

   Bir Map ilk kullanıma hazırlamak için sağlamanız gereken minimum başlangıç yapılandırması MapMode:

   • .hybrid,
   • .roadmap veya
   • .satellite

   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ı ayarlama

1. API anahtarı, harita başlatılmadan önce ayarlanmalıdır. Bunu yapmak için haritayı içeren View öğesinin init() etkinlik işleyicisinde Map.apiKey değerini ayarlayın.

   Uyarı: API anahtarını harici veya herkese açık kaynak denetimine eklemeyin.

   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, rakım, yön, eğim, dönüş ve menzili nasıl belirteceğinizi öğreneceksiniz.

1. Map() işlev çağrısını, initialCamera özelliğini içerecek şekilde değiştirin. Manhattan'ın şehir merkezini göstermek için initialCamera öğesini başlatın.

   Not: Parametre sırası önemlidir. Kamera, önce enlem, ardından boylam sağlanarak başlatılır. Özellikle başka bir kaynaktan yapıştırırken her biri için doğru değerleri belirttiğinizden emin olun. Aksi takdirde kamera beklenmeyen bir konum gösterebilir.

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

Yukarıdaki kod, şu parametrelerin değerlerini ayarlar:

• center: Kamera konumunu temsil eden LatLngAltitude
• heading: Kameranın doğrultulacağı, kuzeyden itibaren derece cinsinden yön.
• tilt: Derece cinsinden eğim açısı. 0, doğrudan yukarıyı, 90 ise yatay bakışı gösterir.
• roll: Kameranın dikey düzlemi etrafındaki dönüş açısı (derece cinsinden).
• range: Kameranın enlem ve boylam konumuna olan metre cinsinden mesafesi
• fieldOfView: Kamera görüş alanını temsil eden açı

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

Not: Eğme ve menzil ayarlarını kullanarak kameranın göreceli yüksekliğini de ayarlayabilirsiniz.

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

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

1. Xcode önizlemesi ekleme

   Önizlemeler, simülatör veya harici bir cihaz kullanmak zorunda kalmadan uygulamanızı görmenizi ve uygulamanızla etkileşim kurmanızı sağlayan güçlü bir XCode özelliğidir.

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

   #Preview {
     ContentView()
   }
   

2. Uygulamayı çalıştırma

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

Harita yükleme ve hata durumları

iOS için Haritalar 3D SDK'sı, Map durumunu yönetirken yerleşik görsel geri bildirimleri otomatik olarak gösterir:

• Yükleme yer paylaşımı: Harita görünümü ilk kez başlatıldığında veya yüklenirken ortalanmış bir ilerleme göstergesi görüntülenir.
• Hata yer paylaşımı: Harita yüklenemezse bir hata yer paylaşımı gösterilir.

Map üzerinde style(mapID:error:) kullanarak bulut tabanlı harita stilleri uygularsanız stil yükleme hatalarını işlemek için bir error closure'ı iletebilirsiniz.

Haritaya dokunma etkinliklerini dinleme

Haritadaki dokunma etkinliklerini dinlemek için Map öğesine onTap(_:) değiştiricisini uygulayın. Kullanıcı haritaya dokunduğunda, kapanış, location (LatLngAltitude) ve dokunulan content (MapTapInfo.Content.map veya MapTapInfo.Content.place(id:)) bilgilerini sağlayan bir MapTapInfo değeri alır. Önemli yer etkileşimleri hakkında daha fazla bilgi için Önemli yerlerle etkileşim kurma başlıklı makaleyi inceleyin.

Map(mode: .hybrid)
  .onTap { tapInfo in
    print("Tapped at \(tapInfo.location), content: \(tapInfo.content)")
  }

Tebrikler!

Uygulamaya 3D harita eklediniz.

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