3D Maps

Map3DElement

Classe google.maps.maps3d.Map3DElement

Map3DElement est une interface HTML pour la vue de carte 3D. Notez que mode doit être défini pour que le rendu de la carte 3D commence.

Élément personnalisé :
<gmp-map-3d center="lat,lng,altitude" default-ui-hidden description="string" gesture-handling="auto" heading="number" internal-usage-attribution-ids="id1 id2" map-id="string" max-altitude="number" max-heading="number" max-tilt="number" min-altitude="number" min-heading="number" min-tilt="number" mode="hybrid" range="number" roll="number" tilt="number" default-ui-disabled></gmp-map-3d>

Cette classe étend HTMLElement.

Cette classe implémente Map3DElementOptions.

Accédez-y en appelant const {Map3DElement} = await google.maps.importLibrary("maps3d").
Consultez Bibliothèques de l'API Maps JavaScript.

Constructeur
Map3DElement	Map3DElement([options]) Paramètres :  options : Map3DElementOptions optional

Propriétés
bounds	Type : LatLngBounds|LatLngBoundsLiteral optional Lorsqu'elle est définie, elle limite la position de la caméra aux limites de latitude/longitude spécifiées. Notez que les objets situés en dehors des limites sont toujours affichés. Les limites peuvent restreindre à la fois la longitude et la latitude, ou seulement l'une ou l'autre. Pour les limites de latitude uniquement, utilisez respectivement les longitudes ouest et est de -180 et 180. Pour les limites de longitude uniquement, utilisez les latitudes nord et sud de 90 et -90, respectivement.
center	Type : LatLngAltitude|LatLngAltitudeLiteral optional Centre de la carte, indiqué sous la forme d'un LatLngAltitude, où l'altitude est exprimée en mètres au-dessus du niveau du sol. Notez qu'il ne s'agit pas nécessairement de l'emplacement de la caméra, car le champ range affecte la distance de la caméra par rapport au centre de la carte. Si ce champ n'est pas défini, la valeur par défaut est {lat: 0, lng: 0, altitude: 63170000}. 63 170 000 mètres est l'altitude maximale autorisée (rayon de la Terre multiplié par 10). Attribut HTML : <gmp-map-3d center="lat,lng,altitude"></gmp-map-3d>
defaultUIHidden	Type : boolean optional Par défaut : false Lorsque la valeur est true, tous les boutons de l'interface utilisateur par défaut sont masqués. Attribut HTML : <gmp-map-3d default-ui-hidden></gmp-map-3d>
description	Type : string optional Si elle est fournie, une description d'accessibilité (par exemple, pour une utilisation avec des lecteurs d'écran) sera ajoutée à la carte avec la valeur fournie. Attribut HTML : <gmp-map-3d description="string"></gmp-map-3d>
gestureHandling	Type : GestureHandling optional Par défaut : GestureHandling.GREEDY Contrôle le traitement des gestes coopératifs. Lorsque ce paramètre est défini sur COOPERATIVE, des touches de modification ou des gestes à deux doigts sont nécessaires pour faire défiler la carte. Lorsque ce paramètre est défini sur GREEDY, la page hôte ne peut pas être défilée à partir des événements utilisateur sur l'élément de carte. Lorsqu'elle est définie sur AUTO, la gestion des gestes est déterminée par la possibilité de faire défiler la page hôte. Attribut HTML : <gmp-map-3d gesture-handling="auto"></gmp-map-3d> <gmp-map-3d gesture-handling="cooperative"></gmp-map-3d> <gmp-map-3d gesture-handling="greedy"></gmp-map-3d>
heading	Type : number optional Orientation de la boussole sur la carte, en degrés, où le nord géographique est égal à zéro. En l'absence d'inclinaison, tout roulis sera interprété comme un cap. Attribut HTML : <gmp-map-3d heading="number"></gmp-map-3d>
internalUsageAttributionIds	Type : Iterable<string> optional Ajoute un ID d'attribution d'utilisation à l'initialiseur, ce qui aide Google à comprendre quelles bibliothèques et quels exemples sont utiles aux développeurs, comme l'utilisation d'une bibliothèque de regroupement de repères. Pour désactiver l'envoi de l'ID d'attribution d'utilisation, vous pouvez supprimer cette propriété en toute sécurité. Seules les valeurs uniques seront envoyées. Les modifications apportées à cette valeur après l'instanciation peuvent être ignorées. Attribut HTML : <gmp-map-3d internal-usage-attribution-ids="id1 id2"></gmp-map-3d>
language	Type : string optional Langue dans laquelle afficher la langue de la carte de base. La langue par défaut est celle demandée par le développeur lors du chargement de l'API Maps JavaScript.
mapId	Type : string optional Spécifie un ID de carte qui sera utilisé pour récupérer le style de carte basé dans le cloud pour la carte. Cette valeur ne doit pas être définie après l'initialisation de la carte. Par conséquent, nous nous assurons que l'ID de carte n'est défini que lors de l'initialisation et nous ne publions pas cet attribut sur les canaux publics. Attribut HTML : <gmp-map-3d map-id="string"></gmp-map-3d>
maxAltitude	Type : number optional Altitude maximale au-dessus du sol qui sera affichée sur la carte. La valeur valide est comprise entre 0 et 63170000 mètres (rayon de la Terre multiplié par 10). Attribut HTML : <gmp-map-3d max-altitude="number"></gmp-map-3d>
maxHeading	Type : number optional Angle maximal de l'orientation (rotation) de la carte. La valeur doit être comprise entre 0 et 360 degrés. minHeading et maxHeading représentent un intervalle de <= 360 degrés dans lequel les mouvements de la tête seront autorisés. minHeading = 180 et maxHeading = 90 permettront de se diriger vers [0, 90] et [180, 360]. minHeading = 90 et maxHeading = 180 permettront de se diriger vers [90, 180]. Attribut HTML : <gmp-map-3d max-heading="number"></gmp-map-3d>
maxTilt	Type : number optional Angle d'incidence maximal de la carte. La valeur doit être comprise entre 0 et 90 degrés. Attribut HTML : <gmp-map-3d max-tilt="number"></gmp-map-3d>
minAltitude	Type : number optional Altitude minimale au-dessus du sol qui sera affichée sur la carte. La valeur valide est comprise entre 0 et 63170000 mètres (rayon de la Terre multiplié par 10). Attribut HTML : <gmp-map-3d min-altitude="number"></gmp-map-3d>
minHeading	Type : number optional Angle minimal de l'orientation (rotation) de la carte. La valeur doit être comprise entre 0 et 360 degrés. minHeading et maxHeading représentent un intervalle de <= 360 degrés dans lequel les mouvements de la tête seront autorisés. minHeading = 180 et maxHeading = 90 permettront de se diriger vers [0, 90] et [180, 360]. minHeading = 90 et maxHeading = 180 permettront de se diriger vers [90, 180]. Attribut HTML : <gmp-map-3d min-heading="number"></gmp-map-3d>
minTilt	Type : number optional Angle d'incidence minimal de la carte. La valeur doit être comprise entre 0 et 90 degrés. Attribut HTML : <gmp-map-3d min-tilt="number"></gmp-map-3d>
mode	Type : MapMode optional Spécifie le mode dans lequel la carte doit être affichée. Si elle n'est pas définie, la carte ne s'affiche pas. Attribut HTML : <gmp-map-3d mode="hybrid"></gmp-map-3d> <gmp-map-3d mode="satellite"></gmp-map-3d>
range	Type : number optional Distance entre la caméra et le centre de la carte, en mètres. Attribut HTML : <gmp-map-3d range="number"></gmp-map-3d>
region	Type : string optional Région avec laquelle tenter d'afficher les points d'intérêt de la carte de base. La région par défaut est celle demandée par le développeur lors du chargement de l'API Maps JavaScript.
roll	Type : number optional Roulis de la caméra autour du vecteur de vue, en degrés. Pour lever toute ambiguïté, en l'absence d'inclinaison, tout roulis sera interprété comme un cap. Attribut HTML : <gmp-map-3d roll="number"></gmp-map-3d>
tilt	Type : number optional Inclinaison du vecteur de vue de la caméra en degrés. Un vecteur de vue pointant directement vers la Terre aurait une inclinaison de zéro degré. Un vecteur de vue pointant vers l'extérieur de la Terre aurait une inclinaison de 180 degrés. Attribut HTML : <gmp-map-3d tilt="number"></gmp-map-3d>
defaultUIDisabled	Obsolète : veuillez utiliser Map3DElement.defaultUIHidden à la place. Cette propriété sera supprimée dans une prochaine version. Type : boolean optional Par défaut : false Lorsque la valeur est true, tous les boutons de l'interface utilisateur par défaut sont désactivés. Ne désactive pas les commandes au clavier et par gestes. Attribut HTML : <gmp-map-3d default-ui-disabled></gmp-map-3d>

Méthodes
addEventListener	addEventListener(type, listener[, options]) Paramètres :  type : string Chaîne sensible à la casse représentant le type d'événement à écouter. listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive. Valeur renvoyée : void Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
flyCameraAround	flyCameraAround(options) Paramètres :  options : FlyAroundAnimationOptions Valeur renvoyée : aucune Cette méthode fait tourner la caméra autour d'un emplacement donné pendant une durée donnée. L'animation peut être répétée le nombre de fois spécifié par FlyAroundAnimationOptions.repeatCount. La caméra se déplace dans le sens des aiguilles d'une montre. La méthode est asynchrone, car les animations ne peuvent démarrer qu'une fois qu'une quantité minimale de données de la carte a été chargée. La méthode est renvoyée une fois l'animation lancée. Si le nombre de FlyAroundAnimationOptions.repeatCount est égal à zéro, aucune rotation ne se produit et l'animation se termine immédiatement après son démarrage.
flyCameraTo	flyCameraTo(options) Paramètres :  options : FlyToAnimationOptions Valeur renvoyée : aucune Cette méthode déplace la caméra de manière parabolique de l'emplacement actuel vers un emplacement de fin donné sur une durée donnée. La méthode est asynchrone, car les animations ne peuvent démarrer qu'une fois qu'une quantité minimale de données de la carte a été chargée. La méthode est renvoyée une fois l'animation lancée.
removeEventListener	removeEventListener(type, listener[, options]) Paramètres :  type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements. listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement. options : boolean|EventListenerOptions optional Consultez les options. Valeur renvoyée : void Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.
stopCameraAnimation	stopCameraAnimation() Paramètres : aucun Valeur renvoyée : aucune Cette méthode arrête toute animation de vol en cours d'exécution. La caméra reste là où elle se trouve au milieu de l'animation. Elle ne se téléporte pas au point d'arrivée. La méthode est asynchrone, car les animations ne peuvent démarrer ou s'arrêter qu'une fois que la carte a été chargée un minimum. La méthode renvoie une fois l'animation arrêtée.

Événements
gmp-animationend	function(animationEndEvent) Arguments : animationEndEvent : Event Cet événement est déclenché lorsque l'animation de vol se termine. Cet événement se propage dans l'arborescence DOM.
gmp-centerchange	function(centerChangeEvent) Arguments : centerChangeEvent : Event Cet événement est déclenché lorsque la propriété "center" de Map3DElement change.
gmp-click	function(clickEvent) Arguments : clickEvent : LocationClickEvent|PlaceClickEvent Cet événement est déclenché lorsque l'utilisateur clique sur l'élément Map3DElement.
gmp-error	function(mapInitializationErrorEvent) Arguments : mapInitializationErrorEvent : Event Cet événement est déclenché lorsque l'initialisation de la carte échoue.
gmp-headingchange	function(headingChangeEvent) Arguments : headingChangeEvent : Event Cet événement est déclenché lorsque la propriété "heading" de Map3DElement change.
gmp-map-id-error	function(mapIdErrorEvent) Arguments : mapIdErrorEvent : Event Cet événement est déclenché lorsque la propriété mapId de Map3DElement n'est pas valide.
gmp-rangechange	function(rangeChangeEvent) Arguments : rangeChangeEvent : Event Cet événement est déclenché lorsque la propriété "range" de Map3DElement change.
gmp-rollchange	function(rollChangeEvent) Arguments : rollChangeEvent : Event Cet événement est déclenché lorsque la propriété "roll" de Map3DElement change.
gmp-steadychange	function(steadyChangeEvent) Arguments : steadyChangeEvent : SteadyChangeEvent Cet événement est déclenché lorsque l'état stable de Map3DElement change.
gmp-tiltchange	function(tiltChangeEvent) Arguments : tiltChangeEvent : Event Cet événement est déclenché lorsque la propriété "tilt" de Map3DElement change.

Interface Map3DElementOptions

google.maps.maps3d.Map3DElementOptions interface

Objet Map3DElementOptions utilisé pour définir les propriétés pouvant être définies sur un Map3DElement.

Propriétés
bounds optional	Type : LatLngBounds|LatLngBoundsLiteral optional Consultez les Map3DElement.bounds.
center optional	Type : LatLngAltitude|LatLngAltitudeLiteral optional Consultez les Map3DElement.center.
defaultUIDisabled optional	Obsolète : veuillez utiliser Map3DElement.defaultUIHidden à la place. Cette propriété sera supprimée dans une prochaine version. Type : boolean optional Consultez les Map3DElement.defaultUIDisabled.
defaultUIHidden optional	Type : boolean optional Consultez les Map3DElement.defaultUIHidden.
description optional	Type : string optional Consultez les Map3DElement.description.
gestureHandling optional	Type : GestureHandling optional Consultez les Map3DElement.gestureHandling.
heading optional	Type : number optional Consultez les Map3DElement.heading.
internalUsageAttributionIds optional	Type : Iterable<string> optional Consultez les Map3DElement.internalUsageAttributionIds.
language optional	Type : string optional Consultez les Map3DElement.language.
mapId optional	Type : string optional Consultez les Map3DElement.mapId.
maxAltitude optional	Type : number optional Consultez les Map3DElement.maxAltitude.
maxHeading optional	Type : number optional Consultez les Map3DElement.maxHeading.
maxTilt optional	Type : number optional Consultez les Map3DElement.maxTilt.
minAltitude optional	Type : number optional Consultez les Map3DElement.minAltitude.
minHeading optional	Type : number optional Consultez les Map3DElement.minHeading.
minTilt optional	Type : number optional Consultez les Map3DElement.minTilt.
mode optional	Type : MapMode optional Consultez les Map3DElement.mode.
range optional	Type : number optional Consultez les Map3DElement.range.
region optional	Type : string optional Consultez les Map3DElement.region.
roll optional	Type : number optional Consultez les Map3DElement.roll.
tilt optional	Type : number optional Consultez les Map3DElement.tilt.

MapMode

google.maps.maps3d.MapMode constantes

Spécifie le mode dans lequel la carte doit être affichée.

Accédez-y en appelant const {MapMode} = await google.maps.importLibrary("maps3d").
Consultez Bibliothèques de l'API Maps JavaScript.

Constantes
HYBRID	Ce mode Plan affiche un calque transparent des rues principales sur des images satellites ou photoréalistes.
SATELLITE	Ce mode affiche des images satellite ou photoréalistes, si elles sont disponibles.

GestureHandling

google.maps.maps3d.GestureHandling constantes

Spécifie comment les événements de gestes doivent être gérés sur l'élément de carte.

Accédez-y en appelant const {GestureHandling} = await google.maps.importLibrary("maps3d").
Consultez Bibliothèques de l'API Maps JavaScript.

Constantes
AUTO	Cela permet à la carte de choisir d'utiliser la gestion coopérative ou gourmande des gestes. Il s'agit du comportement par défaut s'il n'est pas spécifié. La carte passe alors en mode coopératif si elle domine son parent de défilement (généralement la page hôte) de sorte que l'utilisateur ne peut pas faire défiler la carte pour accéder à d'autres contenus.
COOPERATIVE	Cela force le mode coopératif, dans lequel des touches de modification ou des gestes à deux doigts sont nécessaires pour faire défiler la carte.
GREEDY	Cela force le mode gourmand, dans lequel la page hôte ne peut pas être défilée à partir des événements utilisateur sur l'élément de carte.

Interface FlyAroundAnimationOptions

google.maps.maps3d.FlyAroundAnimationOptions interface

Options de personnalisation de l'animation FlyCameraAround.

Propriétés
camera	Type : CameraOptions Point central vers lequel la caméra doit être orientée pendant l'animation de l'orbite. Notez que l'orientation de la carte change à mesure que la caméra tourne autour de ce point central.
durationMillis optional	Type : number optional Durée d'un cycle d'animation en millisecondes.
repeatCount optional	Type : number optional Spécifie le nombre de répétitions d'une animation. Si le nombre est égal à zéro, l'animation se termine immédiatement après son démarrage.
rounds optional	Obsolète : veuillez utiliser FlyAroundAnimationOptions.repeatCount à la place. Type : number optional Nombre de tours à effectuer autour du centre pendant la durée donnée. Cela contrôle la vitesse globale de rotation. Si vous transmettez un nombre négatif à "rounds", la caméra tourne dans le sens inverse des aiguilles d'une montre au lieu du sens par défaut.

Interface FlyToAnimationOptions

google.maps.maps3d.FlyToAnimationOptions interface

Options de personnalisation de l'animation FlyCameraTo.

Propriétés
endCamera	Type : CameraOptions Emplacement vers lequel la caméra doit pointer à la fin de l'animation.
durationMillis optional	Type : number optional Durée de l'animation en millisecondes. Une durée de 0 téléporte la caméra directement à la position de fin.

Interface CameraOptions

google.maps.maps3d.CameraOptions interface

Objet CameraOptions utilisé pour définir les propriétés pouvant être définies sur un objet Camera. L'objet caméra peut être n'importe quel élément ayant une position de caméra, par exemple l'état actuel de la carte ou l'état d'animation demandé pour l'avenir.

Propriétés
center optional	Type : LatLngAltitude|LatLngAltitudeLiteral optional Consultez les Map3DElement.center.
heading optional	Type : number optional Consultez les Map3DElement.heading.
range optional	Type : number optional Consultez les Map3DElement.range.
roll optional	Type : number optional Consultez les Map3DElement.roll.
tilt optional	Type : number optional Consultez les Map3DElement.tilt.

Classe SteadyChangeEvent

Classe google.maps.maps3d.SteadyChangeEvent

Cet événement est créé à partir de la surveillance d'un état stable de Map3DElement. Cet événement se propage dans l'arborescence DOM.

Cette classe étend Event.

Accédez-y en appelant const {SteadyChangeEvent} = await google.maps.importLibrary("maps3d").
Consultez Bibliothèques de l'API Maps JavaScript.

Propriétés
isSteady	Type : boolean Indique si Map3DElement est stable (c'est-à-dire que l'affichage de la scène actuelle est terminé) ou non.

LocationClickEvent

Classe google.maps.maps3d.LocationClickEvent

Cet événement est créé lorsque l'utilisateur clique sur un Map3DElement.

Cette classe étend Event.

Accédez-y en appelant const {LocationClickEvent} = await google.maps.importLibrary("maps3d").
Consultez Bibliothèques de l'API Maps JavaScript.

Propriétés

position

Type : LatLngAltitude optional Latitude/longitude/altitude sous le curseur au moment de l'événement. Notez qu'à des niveaux plus grossiers, les données renvoyées seront moins précises. De plus, l'altitude du fond marin peut être renvoyée pour la valeur d'altitude lorsque vous cliquez sur la surface de l'eau depuis des positions de caméra plus élevées. Cet événement se propage dans l'arborescence DOM.

Classe PlaceClickEvent

Classe google.maps.maps3d.PlaceClickEvent

Cet événement est créé lorsqu'un utilisateur clique sur l'icône d'un lieu sur un Map3DElement. Pour empêcher l'affichage du popover par défaut, appelez la méthode preventDefault() sur cet événement afin d'empêcher qu'il ne soit géré par le Map3DElement.

Cette classe étend LocationClickEvent.

Accédez-y en appelant const {PlaceClickEvent} = await google.maps.importLibrary("maps3d").
Consultez Bibliothèques de l'API Maps JavaScript.

Propriétés
placeId	Type : string ID de lieu de l'élément géographique de la carte.
Hérité : position

Méthodes

fetchPlace

fetchPlace() Paramètres : aucun Valeur renvoyée : Promise<Place> Récupère un Place pour cet ID de lieu. Dans l'objet Place obtenu, la propriété "id" sera renseignée. Des champs supplémentaires peuvent être demandés ultérieurement via Place.fetchFields(), sous réserve de l'activation et de la facturation normales de l'API Places. La promesse est rejetée si une erreur s'est produite lors de la récupération de Place.