Maps

Classe MapElement

Classe google.maps.MapElement

MapElement est une sous-classe HTMLElement pour le rendu des cartes. Une fois la bibliothèque maps chargée, une carte peut être créée en HTML. Exemple : 

<gmp-map center="37.4220656,-122.0840897" zoom="10" map-id="DEMO_MAP_ID">
  <button slot="control-block-start-inline-end">Custom Control</button>
</gmp-map>
En interne, il utilise Map, qui est accessible avec la propriété MapElement.innerMap.

Élément personnalisé :
<gmp-map center="lat,lng" heading-interaction-disabled internal-usage-attribution-ids="id1 id2" map-id="string" rendering-type="vector" tilt-interaction-disabled zoom="number"></gmp-map>

Cette classe étend HTMLElement.

Cette classe implémente MapElementOptions.

Accédez-y en appelant le const {MapElement} = await google.maps.importLibrary("maps").
 Consultez Bibliothèques de l'API Maps JavaScript.
MapElement
MapElement([options])
Paramètres :
center
Type : LatLng|LatLngLiteral optional
Latitude et longitude du centre de la carte.
Attribut HTML :
  • <gmp-map center="lat,lng"></gmp-map>
headingInteractionDisabled
Type : boolean optional
Par défaut : false
Indique si la carte doit autoriser le contrôle de l'orientation de la caméra par l'utilisateur (rotation). Cette option n'est effective que lorsque la carte est une carte vectorielle. Si ce paramètre n'est pas défini dans le code, la configuration cloud de l'ID de carte est utilisée (si elle est disponible).
Attribut HTML :
  • <gmp-map heading-interaction-disabled></gmp-map>
innerMap
Type : Map
Référence au Map que MapElement utilise en interne.
internalUsageAttributionIds
Type : Iterable<string> optional
Par défaut : null
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 ne pas envoyer l'ID d'attribution de l'utilisation, vous pouvez supprimer cette propriété ou remplacer la valeur par une chaîne vide. 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 internal-usage-attribution-ids="id1 id2"></gmp-map>
mapId
Type : string optional
L'ID de carte de la carte. Ce paramètre ne peut pas être défini ni modifié une fois la carte instanciée. Map.DEMO_MAP_ID peut être utilisé pour tester des fonctionnalités qui nécessitent un ID de carte, mais pas l'activation du cloud.
Attribut HTML :
  • <gmp-map map-id="string"></gmp-map>
renderingType
Type : RenderingType optional
Par défaut : RenderingType.VECTOR
Si la carte doit être matricielle ou vectorielle. Ce paramètre ne peut pas être défini ni modifié une fois la carte instanciée. Si elle n'est pas définie, la configuration cloud de l'ID de carte déterminera le type de rendu (si disponible). Veuillez noter que les cartes vectorielles ne sont pas disponibles pour tous les appareils ni tous les navigateurs. La carte basculera vers une carte matricielle si nécessaire.
Attribut HTML :
  • <gmp-map rendering-type="vector"></gmp-map>
  • <gmp-map rendering-type="raster"></gmp-map>
tiltInteractionDisabled
Type : boolean optional
Par défaut : false
Indique si la carte doit autoriser le contrôle de l'inclinaison de la caméra par l'utilisateur. Cette option n'est effective que lorsque la carte est une carte vectorielle. Si ce paramètre n'est pas défini dans le code, la configuration cloud de l'ID de carte est utilisée (si elle est disponible).
Attribut HTML :
  • <gmp-map tilt-interaction-disabled></gmp-map>
zoom
Type : number optional
Niveau de zoom de la carte. Les valeurs de zoom valides sont des nombres compris entre zéro et le niveau de zoom maximal autorisé. Plus la valeur de zoom est élevée, plus la résolution est élevée.
Attribut HTML :
  • <gmp-map zoom="number"></gmp-map>
control-block-end-inline-center
Place l'élément inséré à la position ControlPosition.BLOCK_END_INLINE_CENTER.
control-block-end-inline-end
Place l'élément inséré à la position ControlPosition.BLOCK_END_INLINE_END.
control-block-end-inline-start
Place l'élément inséré à la position ControlPosition.BLOCK_END_INLINE_START.
control-block-start-inline-center
Place l'élément inséré à la position ControlPosition.BLOCK_START_INLINE_CENTER.
control-block-start-inline-end
Place l'élément inséré à la position ControlPosition.BLOCK_START_INLINE_END.
control-block-start-inline-start
Place l'élément inséré à la position ControlPosition.BLOCK_START_INLINE_START.
control-inline-end-block-center
Place l'élément inséré à la position ControlPosition.INLINE_END_BLOCK_CENTER.
control-inline-end-block-end
Place l'élément inséré à la position ControlPosition.INLINE_END_BLOCK_END.
control-inline-end-block-start
Place l'élément inséré à la position ControlPosition.INLINE_END_BLOCK_START.
control-inline-start-block-center
Place l'élément inséré à la position ControlPosition.INLINE_START_BLOCK_CENTER.
control-inline-start-block-end
Place l'élément inséré à la position ControlPosition.INLINE_START_BLOCK_END.
control-inline-start-block-start
Place l'élément inséré à la position ControlPosition.INLINE_START_BLOCK_START.
default
Vous pouvez créer des composants réutilisables autour des composants Web Maps JavaScript, comme AdvancedMarkerElement, à l'aide d'éléments personnalisés. Par défaut, tous les éléments personnalisés ajoutés directement à MapElement sont insérés et affichés dans MapPanes.overlayMouseTarget. Toutefois, les composants Web de l'API Maps JavaScript peuvent être réinsérés dans les emplacements internes de MapElement.
BetaaddEventListener
addEventListener(type, listener[, options])
Paramètres :
  • type : string chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject L'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é sera distribué à la cible. Consultez addEventListener.
BetaremoveEventListener
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énement.
  • 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 un écouteur d'événements précédemment enregistré avec addEventListener de la cible. Consultez removeEventListener.
gmp-zoomchange
function(event)
Arguments : 
Cet événement est déclenché lorsque la propriété de zoom de la carte change.

Interface MapElementOptions

Interface google.maps.MapElementOptions

Objet MapElementOptions utilisé pour définir les propriétés pouvant être définies sur un MapElement.
center optional
Type : LatLng|LatLngLiteral optional
Consultez les MapElement.center.
headingInteractionDisabled optional
Type : boolean optional
Consultez les MapElement.headingInteractionDisabled.
internalUsageAttributionIds optional
Type : Iterable<string> optional
Consultez les MapElement.internalUsageAttributionIds.
mapId optional
Type : string optional
Consultez les MapElement.mapId.
renderingType optional
Type : RenderingType optional
Consultez les MapElement.renderingType.
tiltInteractionDisabled optional
Type : boolean optional
Consultez les MapElement.tiltInteractionDisabled.
zoom optional
Type : number optional
Consultez les MapElement.zoom.

Classe ZoomChangeEvent

Classe google.maps.ZoomChangeEvent

Cet événement est créé à partir d'une modification du zoom de surveillance.

Cette classe étend Event.

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

Classe Map

Classe google.maps.Map

Cette classe étend MVCObject.

Accédez-y en appelant le const {Map} = await google.maps.importLibrary("maps").
 Consultez Bibliothèques de l'API Maps JavaScript.
Map
Map(mapDiv[, opts])
Paramètres :
  • mapDiv : HTMLElement La carte s'affichera pour remplir cet élément.
  • opts : MapOptions optional Options
Crée une nouvelle carte à l'intérieur du conteneur HTML (en général un élément DIV).
DEMO_MAP_ID ID de carte pouvant être utilisé pour les exemples de code qui nécessitent un ID de carte. Cet ID de carte n'est pas destiné à être utilisé dans des applications de production et ne peut pas être utilisé pour les fonctionnalités qui nécessitent une configuration cloud (comme le style cloud).
controls
Commandes supplémentaires à associer à la carte. Pour ajouter une commande à la carte, ajoutez le <div> de la commande au MVCArray correspondant à la ControlPosition où elle doit être affichée.
data
Type : Data
Instance de Data, liée à la carte. Ajoutez des fonctionnalités à cet objet Data pour les afficher facilement sur cette carte.
mapTypes
Registre des instances MapType par ID de chaîne.
overlayMapTypes
Type : MVCArray<MapType optional>
Autres types de cartes à superposer. Les types de carte de superposition s'affichent par-dessus la carte de base à laquelle ils sont associés, dans l'ordre dans lequel ils apparaissent dans le tableau overlayMapTypes (les superpositions avec des valeurs d'index plus élevées sont affichées devant celles avec des valeurs d'index plus faibles).
fitBounds
fitBounds(bounds[, padding])
Paramètres :
  • bounds : limites LatLngBounds|LatLngBoundsLiteral à afficher.
  • padding : number|Padding optional marge intérieure en pixels. Les limites seront ajustées à la partie de la carte qui reste après la suppression de la marge intérieure. Une valeur numérique génère la même marge intérieure sur les quatre côtés. Indiquez 0 ici pour rendre fitBounds idempotent sur le résultat de getBounds.
Valeur renvoyée : aucune
Définit la fenêtre d'affichage pour qu'elle contienne les limites spécifiées.
Remarque : Lorsque la carte est définie sur display: none, la fonction fitBounds lit la taille de la carte comme étant 0x0 et ne fait donc rien. Pour modifier la fenêtre d'affichage lorsque la carte est masquée, définissez la carte sur visibility: hidden. Vous vous assurez ainsi que le div de la carte a une taille réelle. Pour les cartes vectorielles, cette méthode définit l'inclinaison et le cap de la carte sur leurs valeurs par défaut (zéro). L'appel de cette méthode peut entraîner une animation fluide lorsque la carte effectue un panoramique et un zoom pour s'adapter aux limites. L'animation de cette méthode dépend d'une heuristique interne.
getBounds
getBounds()
Paramètres : aucun
Valeur renvoyée : LatLngBounds|undefined Limites de latitude/longitude de la fenêtre d'affichage actuelle.
Renvoie les limites lat/lng de la fenêtre d'affichage actuelle. Si plusieurs copies du monde sont visibles, la plage de limites de longitude est comprise entre -180 et 180 degrés, inclus. Si la carte n'est pas encore initialisée ou si le centre et le zoom n'ont pas été définis, le résultat est undefined. Pour les cartes vectorielles avec une inclinaison ou un cap non nuls, les limites de latitude/longitude renvoyées représentent le plus petit cadre de délimitation qui comprend la région visible de la fenêtre d'affichage de la carte. Consultez MapCanvasProjection.getVisibleRegion pour obtenir la région visible exacte de la fenêtre d'affichage de la carte.
getCenter
getCenter()
Paramètres : aucun
Valeur renvoyée : LatLng|undefined
Renvoie la position affichée au centre de la carte. Notez que cet objet LatLng n'est pas encapsulé. Pour en savoir plus, consultez LatLng. Si le centre ou les limites n'ont pas été définis, le résultat est undefined.
getClickableIcons
getClickableIcons()
Paramètres : aucun
Valeur renvoyée : boolean|undefined
Renvoie la possibilité de cliquer sur les icônes de la carte. Une icône de carte représente un point d'intérêt (POI). Si la valeur renvoyée est true, les icônes sont cliquables sur la carte.
BetagetDatasetFeatureLayer
getDatasetFeatureLayer(datasetId)
Paramètres :
  • datasetId : string
Valeur renvoyée : FeatureLayer
Renvoie le FeatureLayer pour le datasetId spécifié. Les ID d'ensemble de données doivent être configurés dans la console Google Cloud. Si l'ID de l'ensemble de données n'est pas associé au style de carte, ou si le style basé sur les données n'est pas disponible (aucun ID de carte, aucune tuile vectorielle, aucun calque de caractéristiques de style basé sur les données ni aucun ensemble de données configuré dans le style de carte), une erreur est consignée et la valeur FeatureLayer.isAvailable résultante est définie sur "false".
getDiv
getDiv()
Paramètres : aucun
Valeur renvoyée : HTMLElement mapDiv de la carte.
getFeatureLayer
getFeatureLayer(featureType)
Paramètres :
Valeur renvoyée : FeatureLayer
Renvoie le FeatureLayer du FeatureType spécifique. Un FeatureLayer doit être activé dans la console Google Cloud. Si un FeatureLayer du FeatureType spécifié n'existe pas sur cette carte ou si le style basé sur les données n'est pas disponible (aucun ID de carte, aucune tuile vectorielle et aucun FeatureLayer activé dans le style de carte), une erreur est enregistrée et le FeatureLayer.isAvailable résultant est défini sur "false".
getHeading
getHeading()
Paramètres : aucun
Valeur renvoyée : number|undefined
Renvoie la direction indiquée par la boussole sur la carte. La valeur du cap est mesurée en degrés (dans le sens des aiguilles d'une montre) à partir du nord cardinal. Si la carte n'est pas encore initialisée, le résultat est undefined.
getHeadingInteractionEnabled
getHeadingInteractionEnabled()
Paramètres : aucun
Valeur renvoyée : boolean|null
Indique si les interactions avec les titres sont activées. Cette option n'est effective que lorsque la carte est une carte vectorielle. Si ce paramètre n'est pas défini dans le code, la configuration cloud de l'ID de carte est utilisée (si elle est disponible).
getInternalUsageAttributionIds
getInternalUsageAttributionIds()
Paramètres : aucun
Valeur renvoyée : Iterable<string>|null
Renvoie la liste des ID d'attribution d'utilisation, qui aident 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.
getMapCapabilities
getMapCapabilities()
Paramètres : aucun
Valeur renvoyée : MapCapabilities
Informe l'appelant des fonctionnalités actuellement disponibles pour la carte en fonction de l'ID de carte fourni.
getMapTypeId
getMapTypeId()
Paramètres : aucun
Valeur renvoyée : MapTypeId|string|undefined
getProjection
getProjection()
Paramètres : aucun
Valeur renvoyée : Projection|undefined
Renvoie le Projection actuel. Si la carte n'est pas encore initialisée, le résultat est undefined. Écoutez l'événement projection_changed et vérifiez sa valeur pour vous assurer qu'elle n'est pas undefined.
getRenderingType
getRenderingType()
Paramètres : aucun
Valeur renvoyée : RenderingType
Renvoie le RenderingType actuel de la carte.
getStreetView
getStreetView()
Paramètres : aucun
Valeur renvoyée : StreetViewPanorama Panorama lié à la carte.
Renvoie la limite StreetViewPanorama par défaut associée à la carte, qui peut être un panorama par défaut intégré à la carte ou le panorama défini à l'aide de setStreetView(). Les modifications apportées à streetViewControl de la carte seront reflétées dans l'affichage d'un panorama lié.
getTilt
getTilt()
Paramètres : aucun
Valeur renvoyée : number|undefined
Renvoie l'angle d'incidence actuel de la carte, en degrés, entre le plan de la fenêtre d'affichage et le plan de la carte. Pour les cartes matricielles, le résultat sera 0 pour les images prises directement au-dessus ou 45 pour les images à 45°. Cette méthode ne renvoie pas la valeur définie par setTilt. Pour en savoir plus, consultez setTilt.
getTiltInteractionEnabled
getTiltInteractionEnabled()
Paramètres : aucun
Valeur renvoyée : boolean|null
Indique si les interactions d'inclinaison sont activées. Cette option n'est effective que lorsque la carte est une carte vectorielle. Si ce paramètre n'est pas défini dans le code, la configuration cloud de l'ID de carte est utilisée (si elle est disponible).
getZoom
getZoom()
Paramètres : aucun
Valeur renvoyée : number|undefined
Renvoie le niveau de zoom de la carte. Si le zoom n'a pas été défini, le résultat est undefined.
moveCamera
moveCamera(cameraOptions)
Paramètres :
Valeur renvoyée : aucune
Définit immédiatement les options de caméra de la carte sur les options de caméra cibles, sans animation.