Présentation
La solution 3D Area Explorer vous offre une toute nouvelle façon de découvrir et d'explorer des lieux. Cette solution exploite les capacités des tuiles 3D photoréalistes de Google Maps Platform et de l'API Places pour créer des environnements 3D captivants et interactifs.
L'explorateur de zones 3D est conçu pour répondre à plusieurs objectifs :
Améliorer l'exploration d'une zone : les utilisateurs peuvent explorer virtuellement des quartiers avec un niveau de détail visuel élevé, ce qui leur permet d'obtenir des informations sur les caractéristiques et les points de repère locaux.
Promouvoir des récits basés sur la localisation : la possibilité d'intégrer des points d'intérêt avec des descriptions détaillées permet de créer des expériences narratives qui instruisent et informent les utilisateurs sur des lieux spécifiques.
Inspirer le développement à l'aide des fonctionnalités 3D de Google Maps : elle illustre le potentiel des données de cartographie 3D de Google pour créer des cartes interactives et immersives.
Premiers pas
Activer
Principales technologies
Cette solution repose sur deux technologies clés :
API Google Maps Platform
Nous utilisons plusieurs API de Google Maps Platform pour obtenir la carte de base et les données permettant de créer cette expérience :
- Tuiles 3D photoréalistes Google Maps : les modèles 3D haute résolution des bâtiments et du terrain fournissent une représentation réaliste et visuellement attrayante des environnements urbains.
- API Places : l'application peut identifier et afficher des informations détaillées sur les points d'intérêt (POI) de la zone explorée, ce qui enrichit l'expérience utilisateur avec des connaissances locales.
- La saisie semi-automatique aide les utilisateurs à rechercher des lieux ou des zones d'intérêt spécifiques.
CesiumJS
CesiumJS est responsable du rendu et de l'affichage du globe 3D haute résolution. Il gère le chargement et la visualisation des tuiles 3D photoréalistes de Google, qui fournissent un modèle de maillage 3D des bâtiments et du terrain.
Gestion de la caméra : CesiumJS fournit les outils nécessaires pour contrôler la position, l'orientation et le mouvement de la caméra. Par exemple :
- Définir le point de vue initial pour qu'il se concentre sur le quartier spécifié lors du chargement de l'application.
- Implémenter des mouvements de caméra dynamiques, tels que des animations d'orbite automatisées pour l'exploration.
- Gérer les interactions des utilisateurs avec le globe si de telles fonctionnalités sont incluses (panoramique, zoom, rotation).
Découvrez comment les tuiles 3D photoréalistes peuvent fonctionner avec un moteur de rendu de tuiles 3D.
Composants clés
L'application est divisée en deux applications distinctes :
- Application d'administration
- Application de démonstration
Ce diagramme présente les différences et la corrélation entre les deux applications :
Il serait utile d'examiner chaque application plus en détail :
Application d'administration
Cette application fournit une interface conviviale qui vous permet de personnaliser l'expérience 3D :
Recherche de lieux : utilisez la barre de recherche intégrée de la fonctionnalité Autocomplete de Google Maps Platform pour trouver la zone que vous souhaitez afficher. Une fois que vous avez sélectionné un lieu, la caméra se déplace de manière fluide vers cette zone.
Caméra : ajustez la vitesse de déplacement de la caméra et le type d'orbite pour créer l'expérience de visionnage sélectionnée.
Lieux (points d'intérêt) : définissez la densité, le rayon de recherche et les types de points d'intérêt (par exemple, restaurants, cafés, monuments) que vous souhaitez afficher.
Utilisez cette application pour personnaliser l'expérience de vos utilisateurs finaux.
Explorez les bureaux de Google à Chicago en suivant un mouvement de caméra lent.
Voir Vue dense des attractions touristiques autour du Strip de Las Vegas.
Maintenant, explore Las Vegas en suivant une trajectoire de caméra sinusoïdale à grande vitesse
Explorez le Grand Canyon et toutes ses principales attractions touristiques
Vous trouverez une description détaillée de toutes les personnalisations dans Personnalisations de l'Explorateur de zones en 3D.
Application de démonstration
Il s'agit de l'application finale visible par l'utilisateur qui charge la configuration que vous avez créée dans l'application d'administration. Dans cet environnement 3D immersif, les utilisateurs pourront explorer les zones sélectionnées et découvrir les lieux que vous avez mis en avant.
Une fois que vous avez personnalisé l'apparence de votre application à l'aide de l'application d'administration, vous pouvez télécharger la configuration et exécuter votre application personnalisée à partir du code source.
Expérience utilisateur
Voici quelques-unes des principales fonctionnalités de l'application :
- Les utilisateurs peuvent explorer de manière interactive une zone en 3D, y compris les bâtiments, les points de repère et le relief.
- Les utilisateurs peuvent rechercher et découvrir des lieux à proximité (par exemple, des musées, des parcs ou des restaurants).
Lorsqu'ils sélectionnent un lieu, les utilisateurs peuvent afficher des informations détaillées ou des récits liés à cet emplacement.
Les développeurs peuvent personnaliser leur expérience d'exploration via des paramètres et des commandes (s'ils utilisent l'application d'administration).
La rotation automatique est activée, ce qui permet à la caméra de pivoter automatiquement autour du centre de la zone sélectionnée.
Prérequis
Clé API Google Maps : vous aurez besoin d'une clé API valide pour laquelle les API suivantes sont activées :
Serveur Web : vous pouvez diffuser l'application à partir de l'un des éléments suivants :
- Un serveur Web local (par exemple, à l'aide de Node.js, http-server)
- Un service d'hébergement Web statique (l'application est fournie avec un Dockerfile)
Vous trouverez une description détaillée des options de déploiement dans la section "readme" du projet GitHub.
Déploiement
Vous pouvez déployer l'application en tant qu'application de nœud ou conteneur Docker dans n'importe quel environnement de conteneur, tel que GKE ou GAE. La démonstration hébergée utilise l'architecture suivante :
- Dans cette architecture, le code réside dans un projet GitHub.
- Cloud Build récupère le code à chaque transfert vers la branche principale et déclenche une opération de compilation.
- Lors de la compilation, il injecte la clé API et crée une image qui est ensuite stockée dans Artifact Registry.
- Enfin, il déploie la dernière image stable d'Artifact Registry sur Cloud Run.
- Nous avons également des vérifications d'état et une surveillance en cours pour vérifier l'état des applications déployées.
Informations de facturation
La solution 3D Area Explorer utilise les services Google Maps Platform pour offrir une expérience immersive et dynamique. Certaines API peuvent entraîner des frais. Voici un aperçu des API et des liens vers les tarifs.
Google Maps Platform – API 3D Tiles
La solution 3D Area Explorer utilise l'API 3D Tiles pour améliorer l'expérience visuelle avec des données géospatiales. Pour en savoir plus sur les tarifs de l'API 3D Tiles, consultez la page Tarifs de l'API 3D Tiles de Google Maps Platform.
Google Maps Platform – API Places
L'API Places est utilisée pour les données géolocalisées, ce qui permet d'ajouter des informations enrichies à l'expérience 3D Area Explorer. Pour comprendre les coûts associés à l'API Google Places, consultez la page Tarifs de l'API Places de Google Maps Platform.
Google Maps Platform – API Autocomplete
La fonctionnalité de saisie semi-automatique améliore l'interaction utilisateur. Pour en savoir plus sur les tarifs de l'API Google Maps Autocomplete, consultez la page Tarifs de Places Autocomplete de Google Maps Platform.
CesiumJS
CesiumJS est utilisé pour la visualisation du globe en 3D. Bien que CesiumJS soit un logiciel Open Source, des fonctionnalités ou services supplémentaires peuvent entraîner des coûts associés. Consultez la documentation CesiumJS pour connaître les offres premium.
Il est essentiel de consulter les détails de tarification de chaque API, car les frais sont déterminés individuellement en fonction de l'utilisation. Notez que Google Maps Platform propose un niveau sans frais avec une certaine quantité d'utilisation sans frais, et que les tarifs spécifiques peuvent varier en fonction de facteurs tels que le nombre de requêtes et la région d'utilisation.
Consultez toujours les pages de tarification officielles pour obtenir les informations les plus précises et les plus récentes sur les coûts d'utilisation de Google Maps Platform et de CesiumJS. Assurez-vous de respecter les conditions d'utilisation de ces services pour gérer et comprendre efficacement les dépenses associées.
Conclusion
Ce document présente les fonctionnalités, les composants, l'expérience utilisateur et les exigences techniques de l'explorateur de zones en 3D.
En s'appuyant sur les tuiles 3D photoréalistes et l'API Places de Google, elle permet d'explorer virtuellement des quartiers, de découvrir des points d'intérêt et d'en apprendre plus sur l'histoire locale.
Qu'il s'agisse de présenter une zone, d'améliorer l'exploration ou de promouvoir le storytelling numérique, l'explorateur de zones en 3D offre une plate-forme visuellement époustouflante.
Essayez la démo et personnalisez-la à l'aide de l'application d'administration pour créer une expérience 3D attrayante et informative.