Ajouter une carte 3D à votre application

Cette page explique comment ajouter une carte 3D de base à une application iOS à l'aide du SDK Maps 3D pour iOS. Les instructions de cette page supposent que vous avez déjà suivi les étapes de la page de configuration et que vous disposez des éléments suivants :

• Un projet Google Cloud avec le SDK Maps 3D pour iOS activé
• Une clé API pour le SDK Maps 3D pour iOS
• Xcode version 16.0 ou ultérieure avec le package du SDK Maps 3D pour iOS ajouté.

Pour plus d'informations sur ces prérequis, consultez la section Configuration.

Suivez un atelier de programmation plus avancé.

Consultez d'autres exemples de code sur GitHub.

Partie 1 : Créer une application SwiftUI de base

1. Créez une application dans Xcode.
2. Définissez le nom du produit sur Hello3DWorld, avec l'identifiant de l'organisation défini sur com.example. Le nom du package doit être com.example.Hello3DWorld.
3. Choisissez l'interface SwiftUI.
4. Ajoutez la bibliothèque Maps 3D à votre application. Pour obtenir des instructions, consultez la section Configuration.

Partie 2 : Ajouter une carte

1. Ouvrez le fichier ContentView.swift. Il s'agit du point d'entrée et de la navigation principale de votre application.

2. Importez SwiftUI et le package GoogleMaps3D.

3. Remplacez tout le code dans la déclaration du corps par Map(mode: .hybrid).

   La configuration initiale minimale que vous devez fournir pour initialiser un Map est le MapMode :

   • .hybrid ou
   • .satellite

   Votre fichier ContentView.swift devrait se présenter comme suit :

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

Partie 3 : Définir votre clé API

1. La clé API doit être définie avant l'initialisation de la carte. Pour ce faire, définissez Map.apiKey dans le gestionnaire d'événements init() de la View contenant la carte.

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

Partie 4 : Utiliser une caméra pour contrôler la vue de la carte

Les vues de carte 3D sont contrôlées par la classe Camera. Dans cette étape, vous allez apprendre à spécifier l'emplacement, l'altitude, le cap, l'inclinaison, le roulis et la plage pour personnaliser la vue de la carte.

1. Modifiez l'appel de fonction Map() pour inclure une propriété initialCamera. Initialisez initialCamera pour afficher une vue du centre-ville de Manhattan.

   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)
     }
   }
   

Le code ci-dessus définit des valeurs pour ces paramètres :

• heading : cap en degrés du nord vers lequel la caméra doit pointer.
• tilt: angle d'inclinaison en degrés, où 0 correspond à la verticale et 90 à l'horizontale.
• roll: angle de roulis autour du plan vertical de la caméra, en degrés.
• range: distance en mètres entre la caméra et l'emplacement de latitude et de longitude
• altitude : hauteur de la caméra au-dessus du niveau de la mer.

Si vous ne fournissez aucun de ces paramètres supplémentaires, une valeur par défaut est utilisée.

Pour que la vue de la caméra affiche davantage de données 3D, définissez les paramètres initiaux pour afficher une vue inclinée plus proche.

Partie 6 : Prévisualiser et exécuter votre application

1. Ajouter un aperçu Xcode

   Les aperçus sont une fonctionnalité puissante de XCode qui vous permet de voir votre application et d'interagir avec elle sans avoir à utiliser le simulateur ni un appareil externe.

   Pour ajouter un aperçu, ajoutez un bloc de code #Preview {} en dehors de votre structure.

   #Preview {
     CameraDemo()
   }
   

2. Exécuter l'application

Créez et exécutez l'application.

Félicitations !

Vous avez ajouté une carte 3D à une application.

Vous pouvez ensuite explorer des fonctionnalités plus avancées du SDK Maps 3D pour iOS, telles que les animations de chemin de caméra, les repères 3D ou les polygones.