3D Maps

Map3DElement class

google.maps.maps3d.Map3DElement classe

Map3DElement è un'interfaccia HTML per la visualizzazione della mappa 3D.

Elemento personalizzato:
<gmp-map-3d center="lat,lng,altitude" default-labels-disabled default-ui-disabled heading="number" max-altitude="number" max-heading="number" max-tilt="number" min-altitude="number" min-heading="number" min-tilt="number" range="number" roll="number" tilt="number"></gmp-map-3d>

Questo corso si estende HTMLElement.

Questa classe implementa Map3DElementOptions.

Accesso chiamando il numero const {Map3DElement} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
Map3DElement
Map3DElement([options])
Parametri: 
bounds
Se impostato, limita la posizione della videocamera entro i limiti di latitudine/longitudine specificati. Tieni presente che gli oggetti al di fuori dei limiti vengono comunque visualizzati. I limiti possono restringere sia la longitudine che la latitudine oppure solo la latitudine o la longitudine. Per i limiti di sola latitudine, utilizza le longitudini ovest ed est di -180 e 180, rispettivamente. Per i limiti di sola longitudine, utilizza le latitudini nord e sud di 90 e -90, rispettivamente.
center
Il centro della mappa indicato come LatLngAltitude, dove l'altitudine è espressa in metri sopra il livello del suolo. Tieni presente che questa non è necessariamente la posizione della videocamera, poiché il campo range influisce sulla distanza della videocamera dal centro della mappa. Se non viene impostato, il valore predefinito è {lat: 0, lng: 0, altitude: 63170000}. 63170000 metri è l'altitudine massima consentita (raggio della Terra moltiplicato per 10).
Attributo HTML:
  • <gmp-map-3d center="lat,lng,altitude"></gmp-map-3d>
defaultLabelsDisabled
Tipo:  boolean optional
Predefinito: false
Quando true, le etichette predefinite della mappa non vengono visualizzate.
Attributo HTML:
  • <gmp-map-3d default-labels-disabled></gmp-map-3d>
defaultUIDisabled
Tipo:  boolean optional
Predefinito: false
Quando true, tutti i pulsanti dell'interfaccia utente predefinita sono disattivati. Non disattiva i controlli della tastiera e dei gesti.
Attributo HTML:
  • <gmp-map-3d default-ui-disabled></gmp-map-3d>
heading
Tipo:  number optional
L'orientamento della mappa in gradi, dove il nord è zero. In assenza di inclinazione, qualsiasi rollio verrà interpretato come direzione.
Attributo HTML:
  • <gmp-map-3d heading="number"></gmp-map-3d>
maxAltitude
Tipo:  number optional
L'altitudine massima sopra il livello del suolo che verrà visualizzata sulla mappa. Un valore valido è compreso tra 0 e 63170000 metri (raggio della Terra moltiplicato per 10).
Attributo HTML:
  • <gmp-map-3d max-altitude="number"></gmp-map-3d>
maxHeading
Tipo:  number optional
L'angolo massimo di orientamento (rotazione) della mappa. Un valore valido è compreso tra 0 e 360 gradi. minHeading e maxHeading rappresentano un intervallo di <= 360 gradi in cui saranno consentiti i gesti di direzione. minHeading = 180 e maxHeading = 90 consentiranno di dirigersi verso [0, 90] e [180, 360]. minHeading = 90 e maxHeading = 180 consentiranno di dirigersi verso [90, 180].
Attributo HTML:
  • <gmp-map-3d max-heading="number"></gmp-map-3d>
maxTilt
Tipo:  number optional
L'angolo di incidenza massimo della mappa. Un valore valido è compreso tra 0 e 90 gradi.
Attributo HTML:
  • <gmp-map-3d max-tilt="number"></gmp-map-3d>
minAltitude
Tipo:  number optional
L'altitudine minima dal suolo che verrà visualizzata sulla mappa. Un valore valido è compreso tra 0 e 63170000 metri (raggio della Terra moltiplicato per 10).
Attributo HTML:
  • <gmp-map-3d min-altitude="number"></gmp-map-3d>
minHeading
Tipo:  number optional
L'angolo minimo di direzione (rotazione) della mappa. Un valore valido è compreso tra 0 e 360 gradi. minHeading e maxHeading rappresentano un intervallo di <= 360 gradi in cui saranno consentiti i gesti di direzione. minHeading = 180 e maxHeading = 90 consentiranno di dirigersi verso [0, 90] e [180, 360]. minHeading = 90 e maxHeading = 180 consentiranno di dirigersi verso [90, 180].
Attributo HTML:
  • <gmp-map-3d min-heading="number"></gmp-map-3d>
minTilt
Tipo:  number optional
L'angolo di incidenza minimo della mappa. Un valore valido è compreso tra 0 e 90 gradi.
Attributo HTML:
  • <gmp-map-3d min-tilt="number"></gmp-map-3d>
range
Tipo:  number optional
La distanza dalla videocamera al centro della mappa, in metri.
Attributo HTML:
  • <gmp-map-3d range="number"></gmp-map-3d>
roll
Tipo:  number optional
La rotazione della videocamera attorno al vettore di visualizzazione in gradi. Per risolvere le ambiguità, quando non è presente alcuna inclinazione, qualsiasi rollio verrà interpretato come direzione.
Attributo HTML:
  • <gmp-map-3d roll="number"></gmp-map-3d>
tilt
Tipo:  number optional
L'inclinazione del vettore di visualizzazione della videocamera in gradi. Un vettore di visualizzazione che guarda direttamente verso il basso sulla Terra avrebbe un'inclinazione di zero gradi. Un vettore di visualizzazione che punta lontano dalla Terra avrebbe un'inclinazione di 180 gradi.
Attributo HTML:
  • <gmp-map-3d tilt="number"></gmp-map-3d>
BetaaddEventListener
addEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa sensibile alle maiuscole e minuscole che rappresenta il tipo di evento da ascoltare.
  • listener:  EventListener|EventListenerObject l'oggetto che riceve una notifica. Deve essere una funzione o un oggetto con il metodo handleEvent
  • options:  boolean|AddEventListenerOptions optional vedi le opzioni. Gli eventi personalizzati supportano solo capture e passive.
Valore restituito:  void
Configura una funzione che verrà chiamata ogni volta che l'evento specificato viene inviato alla destinazione. Vedi addEventListener.
flyCameraAround
flyCameraAround(options)
Parametri: 
Valore restituito:nessuno
Questo metodo fa orbitare la videocamera intorno a una determinata posizione per una determinata durata, effettuando il numero specificato di giri in quel periodo di tempo.

Per impostazione predefinita, la videocamera orbita in senso orario. Se viene fornito un numero negativo per i giri, la videocamera orbiterà in senso antiorario.

Il metodo è asincrono perché le animazioni possono iniziare solo dopo che la mappa è stata caricata per un importo minimo. Il metodo viene restituito una volta avviata l'animazione.

Se il numero di giri è zero, non si verificherà alcuna rotazione e l'animazione verrà completata immediatamente dopo l'avvio.
flyCameraTo
flyCameraTo(options)
Parametri: 
Valore restituito:nessuno
Questo metodo sposta la videocamera in modo parabolico dalla posizione attuale a una posizione finale specificata per una durata specificata.

Il metodo è asincrono perché le animazioni possono iniziare solo dopo che la mappa è stata caricata per un importo minimo. Il metodo viene restituito una volta avviata l'animazione.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa che specifica il tipo di evento per cui rimuovere un listener di eventi.
  • listener:  EventListener|EventListenerObject Il listener di eventi del gestore di eventi da rimuovere dalla destinazione dell'evento.
  • options:  boolean|EventListenerOptions optional vedi le opzioni.
Valore restituito:  void
Rimuove dal target un listener di eventi registrato in precedenza con addEventListener. Vedi removeEventListener.
stopCameraAnimation
stopCameraAnimation()
Parametri: nessuno
Valore restituito:nessuno
Questo metodo interrompe qualsiasi animazione di volo in esecuzione. La videocamera rimane dov'è a metà animazione; non si teletrasporta al punto finale.

Il metodo è asincrono perché le animazioni possono iniziare o arrestarsi solo dopo che la mappa ha caricato una quantità minima. Il metodo viene restituito una volta interrotta l'animazione.
gmp-animationend
function(animationEndEvent)
Argomenti: 
  • animationEndEvent:  Event
Questo evento viene attivato al termine dell'animazione di spostamento. Questo evento si propaga verso l'alto attraverso l'albero DOM.
gmp-centerchange
function(centerChangeEvent)
Argomenti: 
  • centerChangeEvent:  Event
Questo evento viene attivato quando la proprietà center di Map3DElement cambia.
gmp-click
function(clickEvent)
Argomenti: 
Questo evento viene attivato quando viene fatto clic sull'elemento Map3DElement.
gmp-headingchange
function(headingChangeEvent)
Argomenti: 
  • headingChangeEvent:  Event
Questo evento viene attivato quando cambia la proprietà heading di Map3DElement.
gmp-rangechange
function(rangeChangeEvent)
Argomenti: 
  • rangeChangeEvent:  Event
Questo evento viene attivato quando la proprietà range di Map3DElement cambia.
gmp-rollchange
function(rollChangeEvent)
Argomenti: 
  • rollChangeEvent:  Event
Questo evento viene attivato quando la proprietà roll di Map3DElement cambia.
gmp-steadychange
function(steadyChangeEvent)
Argomenti: 
Questo evento viene attivato quando cambia lo stato stazionario di Map3DElement.
gmp-tiltchange
function(tiltChangeEvent)
Argomenti: 
  • tiltChangeEvent:  Event
Questo evento viene attivato quando la proprietà di inclinazione di Map3DElement cambia.

Interfaccia Map3DElementOptions

google.maps.maps3d.Map3DElementOptions interfaccia

Oggetto Map3DElementOptions utilizzato per definire le proprietà che possono essere impostate su un Map3DElement.
bounds optional
Leggi i Map3DElement.bounds.
center optional
Leggi i Map3DElement.center.
defaultLabelsDisabled optional
Tipo:  boolean optional
Leggi i Map3DElement.defaultLabelsDisabled.
defaultUIDisabled optional
Tipo:  boolean optional
Leggi i Map3DElement.defaultUIDisabled.
heading optional
Tipo:  number optional
Leggi i Map3DElement.heading.
maxAltitude optional
Tipo:  number optional
Leggi i Map3DElement.maxAltitude.
maxHeading optional
Tipo:  number optional
Leggi i Map3DElement.maxHeading.
maxTilt optional
Tipo:  number optional
Leggi i Map3DElement.maxTilt.
minAltitude optional
Tipo:  number optional
Leggi i Map3DElement.minAltitude.
minHeading optional
Tipo:  number optional
Leggi i Map3DElement.minHeading.
minTilt optional
Tipo:  number optional
Leggi i Map3DElement.minTilt.
range optional
Tipo:  number optional
Leggi i Map3DElement.range.
roll optional
Tipo:  number optional
Leggi i Map3DElement.roll.
tilt optional
Tipo:  number optional
Leggi i Map3DElement.tilt.

Interfaccia FlyAroundAnimationOptions

google.maps.maps3d.FlyAroundAnimationOptions interfaccia

Opzioni di personalizzazione per l'animazione FlyCameraAround.
camera
Il punto centrale verso cui la videocamera deve essere rivolta durante l'animazione dell'orbita. Tieni presente che l'orientamento della mappa cambierà man mano che la videocamera orbita intorno a questo punto centrale.
durationMillis optional
Tipo:  number optional
La durata dell'animazione in millisecondi. Si tratta della durata totale dell'animazione, non della durata di una singola rotazione.
rounds optional
Tipo:  number optional
Il numero di giri da effettuare intorno al centro nella durata specificata. Controlla la velocità complessiva di rotazione. Se passi un numero negativo a rounds, la videocamera ruoterà in senso antiorario anziché in senso orario predefinito.

FlyToAnimationOptions

google.maps.maps3d.FlyToAnimationOptions interfaccia

Opzioni di personalizzazione per l'animazione FlyCameraTo.
endCamera
La posizione verso cui deve essere puntata la videocamera alla fine dell'animazione.
durationMillis optional
Tipo:  number optional
La durata dell'animazione in millisecondi. Una durata di 0 teletrasporterà la videocamera direttamente alla posizione finale.

Interfaccia CameraOptions

google.maps.maps3d.CameraOptions interfaccia

Oggetto CameraOptions utilizzato per definire le proprietà che possono essere impostate su un oggetto fotocamera. L'oggetto della videocamera può essere qualsiasi cosa che abbia una posizione della videocamera, ad esempio lo stato attuale della mappa o un futuro stato di animazione richiesto.
center optional
Leggi i Map3DElement.center.
heading optional
Tipo:  number optional
Leggi i Map3DElement.heading.
range optional
Tipo:  number optional
Leggi i Map3DElement.range.
roll optional
Tipo:  number optional
Leggi i Map3DElement.roll.
tilt optional
Tipo:  number optional
Leggi i Map3DElement.tilt.

SteadyChangeEvent class

google.maps.maps3d.SteadyChangeEvent classe

Questo evento viene creato dal monitoraggio di uno stato stazionario di Map3DElement. Questo evento si propaga verso l'alto attraverso l'albero DOM.

Questo corso si estende Event.

Accesso chiamando il numero const {SteadyChangeEvent} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
isSteady
Tipo:  boolean
Indica se Map3DElement è stabile (ovvero se è stato completato il rendering della scena corrente) o meno.

LocationClickEvent classe

google.maps.maps3d.LocationClickEvent classe

Questo evento viene creato facendo clic su un elemento Map3DElement.

Questo corso si estende Event.

Accesso chiamando il numero const {LocationClickEvent} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
position
Tipo:  LatLngAltitude optional
La latitudine/longitudine/altitudine che si trovava sotto il cursore quando si è verificato l'evento. Tieni presente che a livelli più grossolani verranno restituiti dati meno precisi. Inoltre, l'elevazione del fondale marino potrebbe essere restituita per il valore dell'altitudine quando si fa clic sulla superficie dell'acqua da posizioni della videocamera più elevate. Questo evento si propaga verso l'alto attraverso l'albero DOM.

Classe PlaceClickEvent

google.maps.maps3d.PlaceClickEvent classe

Questo evento viene creato facendo clic su un elemento Map3DElement.

Questo corso si estende LocationClickEvent.

Accesso chiamando il numero const {PlaceClickEvent} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
placeId
Tipo:  string
L'ID luogo della funzionalità della mappa.
Ereditato: position
fetchPlace
fetchPlace()
Parametri: nessuno
Valore restituito:  Promise<Place>
Recupera un Place per questo ID luogo. Nell'oggetto Place risultante, la proprietà id verrà compilata. I campi aggiuntivi possono essere richiesti successivamente tramite Place.fetchFields(), in base all'attivazione e alla fatturazione normali dell'API Places. La promessa viene rifiutata se si è verificato un errore durante il recupero di Place.

Classe Marker3DElement

google.maps.maps3d.Marker3DElement classe

Mostra una posizione su una mappa 3D. Tieni presente che position deve essere impostato per la visualizzazione di Marker3DElement.

Elemento personalizzato:
<gmp-marker-3d altitude-mode="absolute" collision-behavior="required" draws-when-occluded extruded label="string" size-preserved z-index="number"></gmp-marker-3d>

Questo corso si estende HTMLElement.

Questa classe implementa Marker3DElementOptions.

Accesso chiamando il numero const {Marker3DElement} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
Marker3DElement
Marker3DElement([options])
Parametri: 
Crea un Marker3DElement con le opzioni specificate.
altitudeMode
Tipo:  AltitudeMode optional
Predefinito: AltitudeMode.CLAMP_TO_GROUND
Specifica come viene interpretata la componente altitudine della posizione.
Attributo HTML:
  • <gmp-marker-3d altitude-mode="absolute"></gmp-marker-3d>
  • <gmp-marker-3d altitude-mode="clamp-to-ground"></gmp-marker-3d>
  • <gmp-marker-3d altitude-mode="relative-to-ground"></gmp-marker-3d>
  • <gmp-marker-3d altitude-mode="relative-to-mesh"></gmp-marker-3d>
collisionBehavior
Tipo:  CollisionBehavior optional
Predefinito: CollisionBehavior.REQUIRED
Un'enumerazione che specifica il comportamento di un Marker3DElement quando entra in collisione con un altro Marker3DElement o con le etichette della basemap.
Attributo HTML:
  • <gmp-marker-3d collision-behavior="required"></gmp-marker-3d>
  • <gmp-marker-3d collision-behavior="required-and-hides-optional"></gmp-marker-3d>
  • <gmp-marker-3d collision-behavior="optional-and-hides-lower-priority"></gmp-marker-3d>
drawsWhenOccluded
Tipo:  boolean optional
Predefinito: false
Specifica se questo indicatore deve essere disegnato o meno quando è occluso. Il marcatore può essere oscurato dalla geometria della mappa (ad es. edifici).
Attributo HTML:
  • <gmp-marker-3d draws-when-occluded></gmp-marker-3d>
extruded
Tipo:  boolean optional
Predefinito: false
Specifica se collegare il marcatore al terreno. Per estrudere un indicatore, altitudeMode deve essere RELATIVE_TO_GROUND o ABSOLUTE.
Attributo HTML:
  • <gmp-marker-3d extruded></gmp-marker-3d>
label
Tipo:  string optional
Testo da visualizzare con questo indicatore.
Attributo HTML:
  • <gmp-marker-3d label="string"></gmp-marker-3d>
position
La posizione della punta del pennarello. L'altitudine viene ignorata in alcune modalità ed è quindi facoltativa.
sizePreserved
Tipo:  boolean optional
Predefinito: false
Specifica se questo marcatore deve mantenere le sue dimensioni o meno, indipendentemente dalla distanza dalla videocamera. Per impostazione predefinita, il marcatore viene scalato in base alla distanza dalla videocamera/inclinazione.
Attributo HTML:
  • <gmp-marker-3d size-preserved></gmp-marker-3d>
zIndex
Tipo:  number optional
Il valore zIndex rispetto agli altri indicatori.
Attributo HTML:
  • <gmp-marker-3d z-index="number"></gmp-marker-3d>
default
Gli elementi personalizzati aggiunti direttamente a Marker3DElement verranno inseriti, ma per disegnare i marcatori verranno utilizzati solo gli elementi di tipo HTMLImageElement, SVGElement e PinElement, mentre gli altri elementi verranno ignorati.
HTMLImageElement e SVGElement devono essere racchiusi nell'elemento <template> prima di essere assegnati allo slot predefinito di Marker3DElement.

Le immagini e gli SVG vengono attualmente rasterizzati prima di essere sottoposti a rendering nella scena 3D, pertanto l'HTML personalizzato incorporato in SVG o le classi CSS aggiunte alle immagini non verranno applicate e potrebbero non essere visualizzate quando i marcatori vengono mostrati sullo schermo.
BetaaddEventListener
addEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa sensibile alle maiuscole e minuscole che rappresenta il tipo di evento da ascoltare.
  • listener:  EventListener|EventListenerObject l'oggetto che riceve una notifica. Deve essere una funzione o un oggetto con il metodo handleEvent
  • options:  boolean|AddEventListenerOptions optional vedi le opzioni. Gli eventi personalizzati supportano solo capture e passive.
Valore restituito:  void
Configura una funzione che verrà chiamata ogni volta che l'evento specificato viene inviato alla destinazione. Vedi addEventListener.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa che specifica il tipo di evento per cui rimuovere un listener di eventi.
  • listener:  EventListener|EventListenerObject Il listener di eventi del gestore di eventi da rimuovere dalla destinazione dell'evento.
  • options:  boolean|EventListenerOptions optional vedi le opzioni.
Valore restituito:  void
Rimuove dal target un listener di eventi registrato in precedenza con addEventListener. Vedi removeEventListener.

Interfaccia Marker3DElementOptions

google.maps.maps3d.Marker3DElementOptions interfaccia

Oggetto Marker3DElementOptions utilizzato per definire le proprietà che possono essere impostate su un Marker3DElement.
altitudeMode optional
Tipo:  AltitudeMode optional
Leggi i Marker3DElement.altitudeMode.
collisionBehavior optional
Tipo:  CollisionBehavior optional
Leggi i Marker3DElement.collisionBehavior.
drawsWhenOccluded optional
Tipo:  boolean optional
Leggi i Marker3DElement.drawsWhenOccluded.
extruded optional
Tipo:  boolean optional
Leggi i Marker3DElement.extruded.
label optional
Tipo:  string optional
Leggi i Marker3DElement.label.
position optional
Leggi i Marker3DElement.position.
sizePreserved optional
Tipo:  boolean optional
Leggi i Marker3DElement.sizePreserved.
zIndex optional
Tipo:  number optional
Leggi i Marker3DElement.zIndex.

Classe Marker3DInteractiveElement

google.maps.maps3d.Marker3DInteractiveElement classe

Mostra una posizione su una mappa 3D. Tieni presente che position deve essere impostato per la visualizzazione di Marker3DInteractiveElement. A differenza di Marker3DElement, Marker3DInteractiveElement riceve un evento gmp-click.

Elemento personalizzato:
<gmp-marker-3d-interactive></gmp-marker-3d-interactive>

Questo corso si estende Marker3DElement.

Questa classe implementa Marker3DInteractiveElementOptions.

Accesso chiamando il numero const {Marker3DInteractiveElement} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
Marker3DInteractiveElement
Marker3DInteractiveElement([options])
Parametri: 
Crea un Marker3DInteractiveElement con le opzioni specificate.
Ereditato: altitudeMode, collisionBehavior, drawsWhenOccluded, extruded, label, position, sizePreserved, zIndex
default
Qualsiasi elemento personalizzato aggiunto direttamente a Marker3DInteractiveElement verrà inserito, tuttavia per disegnare i marcatori verranno utilizzati solo gli elementi di tipo PinElement, mentre gli altri elementi verranno ignorati.
addEventListener
addEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa sensibile alle maiuscole e minuscole che rappresenta il tipo di evento da ascoltare.
  • listener:  EventListener|EventListenerObject l'oggetto che riceve una notifica. Deve essere una funzione o un oggetto con il metodo handleEvent
  • options:  boolean|AddEventListenerOptions optional vedi le opzioni. Gli eventi personalizzati supportano solo capture e passive.
Valore restituito:  void
Configura una funzione che verrà chiamata ogni volta che l'evento specificato viene inviato alla destinazione. Vedi addEventListener
removeEventListener
removeEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa che specifica il tipo di evento per cui rimuovere un listener di eventi.
  • listener:  EventListener|EventListenerObject Il listener di eventi del gestore di eventi da rimuovere dalla destinazione dell'evento.
  • options:  boolean|EventListenerOptions optional vedi le opzioni
Valore restituito:  void
Rimuove dal target un listener di eventi registrato in precedenza con addEventListener. Vedi removeEventListener
gmp-click
function(clickEvent)
Argomenti: 
Questo evento viene attivato quando viene fatto clic sull'elemento Marker3DInteractiveElement.

Marker3DInteractiveElementOptions interfaccia

google.maps.maps3d.Marker3DInteractiveElementOptions interfaccia

Oggetto Marker3DInteractiveElementOptions utilizzato per definire le proprietà che possono essere impostate su un Marker3DInteractiveElement.

Questa interfaccia estende Marker3DElementOptions.

Ereditato: altitudeMode, collisionBehavior, drawsWhenOccluded, extruded, label, position, sizePreserved, zIndex

Model3DElement class

google.maps.maps3d.Model3DElement classe

Un modello 3D che consente il rendering dei modelli glTF. Tieni presente che position e src devono essere impostati per la visualizzazione di Model3DElement.

Le proprietà principali di gLTF PBR devono essere supportate. Al momento non sono supportate estensioni o proprietà delle estensioni.

Elemento personalizzato:
<gmp-model-3d altitude-mode="absolute" src="src"></gmp-model-3d>

Questo corso si estende HTMLElement.

Questa classe implementa Model3DElementOptions.

Accesso chiamando il numero const {Model3DElement} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
Model3DElement
Model3DElement([options])
Parametri: 
Crea un Model3DElement con le opzioni specificate.
altitudeMode
Tipo:  AltitudeMode optional
Predefinito: AltitudeMode.CLAMP_TO_GROUND
Specifica come viene interpretata l'altitudine nella posizione.
Attributo HTML:
  • <gmp-model-3d altitude-mode="absolute"></gmp-model-3d>
  • <gmp-model-3d altitude-mode="clamp-to-ground"></gmp-model-3d>
  • <gmp-model-3d altitude-mode="relative-to-ground"></gmp-model-3d>
  • <gmp-model-3d altitude-mode="relative-to-mesh"></gmp-model-3d>
orientation
Descrive la rotazione del sistema di coordinate di un modello 3D per posizionarlo sulla mappa 3D. Le rotazioni

vengono applicate al modello nel seguente ordine: rollio, beccheggio e poi direzione.
position
Imposta la posizione di Model3DElement. L'altitudine viene ignorata in alcune modalità ed è quindi facoltativa.
scale
Tipo:  number|Vector3D|Vector3DLiteral optional
Predefinito: 1
Scala il modello lungo gli assi x, y e z nello spazio delle coordinate del modello.
src
Tipo:  string|URL optional
Specifica l'URL del modello 3D. Al momento sono supportati solo i modelli in formato .glb.

Tutti gli URL HTTP relativi verranno risolti nei rispettivi URL assoluti.

Tieni presente che se ospiti i file del modello .glb su un sito web o un server diverso dall'applicazione principale, assicurati di configurare le intestazioni HTTP CORS corrette. In questo modo, la tua applicazione può accedere in modo sicuro ai file del modello dell'altro dominio.
Attributo HTML:
  • <gmp-model-3d src="src"></gmp-model-3d>
BetaaddEventListener
addEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa sensibile alle maiuscole e minuscole che rappresenta il tipo di evento da ascoltare.
  • listener:  EventListener|EventListenerObject l'oggetto che riceve una notifica. Deve essere una funzione o un oggetto con il metodo handleEvent
  • options:  boolean|AddEventListenerOptions optional vedi le opzioni. Gli eventi personalizzati supportano solo capture e passive.
Valore restituito:  void
Configura una funzione che verrà chiamata ogni volta che l'evento specificato viene inviato alla destinazione. Vedi addEventListener.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa che specifica il tipo di evento per cui rimuovere un listener di eventi.
  • listener:  EventListener|EventListenerObject Il listener di eventi del gestore di eventi da rimuovere dalla destinazione dell'evento.
  • options:  boolean|EventListenerOptions optional vedi le opzioni.
Valore restituito:  void
Rimuove dal target un listener di eventi registrato in precedenza con addEventListener. Vedi removeEventListener.

Interfaccia Model3DElementOptions

google.maps.maps3d.Model3DElementOptions interfaccia

Oggetto Model3DElementOptions utilizzato per definire le proprietà che possono essere impostate su un Model3DElement.
altitudeMode optional
Tipo:  AltitudeMode optional
Leggi i Model3DElement.altitudeMode.
orientation optional
Leggi i Model3DElement.orientation.
position optional
Leggi i Model3DElement.position.
scale optional
Tipo:  number|Vector3D|Vector3DLiteral optional
Leggi i Model3DElement.scale.
src optional
Tipo:  string|URL optional
Leggi i Model3DElement.src.

Classe Polyline3DElement

google.maps.maps3d.Polyline3DElement classe

Una polilinea 3D è una sovrapposizione lineare di segmenti di linea collegati su una mappa 3D.

Elemento personalizzato:
<gmp-polyline-3d altitude-mode="absolute" draws-occluded-segments extruded geodesic outer-color="string" outer-width="number" stroke-color="string" stroke-width="number" z-index="number"></gmp-polyline-3d>

Questo corso si estende HTMLElement.

Questa classe implementa Polyline3DElementOptions.

Accesso chiamando il numero const {Polyline3DElement} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
Polyline3DElement
Polyline3DElement([options])
Parametri: 
Crea un Polyline3DElement con le opzioni specificate.
altitudeMode
Tipo:  AltitudeMode optional
Predefinito: AltitudeMode.ABSOLUTE
Specifica come vengono interpretati i componenti di altitudine nelle coordinate.
Attributo HTML:
  • <gmp-polyline-3d altitude-mode="absolute"></gmp-polyline-3d>
  • <gmp-polyline-3d altitude-mode="clamp-to-ground"></gmp-polyline-3d>
  • <gmp-polyline-3d altitude-mode="relative-to-ground"></gmp-polyline-3d>
  • <gmp-polyline-3d altitude-mode="relative-to-mesh"></gmp-polyline-3d>
coordinates
La sequenza ordinata di coordinate della polilinea. L'altitudine viene ignorata in alcune modalità ed è quindi facoltativa.
drawsOccludedSegments
Tipo:  boolean optional
Predefinito: false
Specifica se vengono disegnate o meno le parti della polilinea che potrebbero essere occluse. Le polilinee possono essere occluse dalla geometria della mappa (ad es. edifici).
Attributo HTML:
  • <gmp-polyline-3d draws-occluded-segments></gmp-polyline-3d>
extruded
Tipo:  boolean optional
Predefinito: false
Specifica se collegare la polilinea al suolo. Per estrudere una polilinea, altitudeMode deve essere RELATIVE_TO_GROUND o ABSOLUTE.
Attributo HTML:
  • <gmp-polyline-3d extruded></gmp-polyline-3d>
geodesic
Tipo:  boolean optional
Predefinito: false
Quando true, i bordi della polilinea vengono interpretati come geodetici e seguono la curvatura della Terra. Quando false, i bordi della polilinea vengono visualizzati come linee rette nello spazio dello schermo.
Attributo HTML:
  • <gmp-polyline-3d geodesic></gmp-polyline-3d>
outerColor
Tipo:  string optional
Il colore esterno. Sono supportati tutti i colori CSS3.
Attributo HTML:
  • <gmp-polyline-3d outer-color="string"></gmp-polyline-3d>
outerWidth
Tipo:  number optional
La larghezza esterna è compresa tra 0.0 e 1.0. Si tratta di una percentuale di strokeWidth.
Attributo HTML:
  • <gmp-polyline-3d outer-width="number"></gmp-polyline-3d>
strokeColor
Tipo:  string optional
Il colore del tratto. Sono supportati tutti i colori CSS3.
Attributo HTML:
  • <gmp-polyline-3d stroke-color="string"></gmp-polyline-3d>
strokeWidth
Tipo:  number optional
La larghezza del tratto in pixel.
Attributo HTML:
  • <gmp-polyline-3d stroke-width="number"></gmp-polyline-3d>
zIndex
Tipo:  number optional
L'indice z rispetto ad altri poligoni.
Attributo HTML:
  • <gmp-polyline-3d z-index="number"></gmp-polyline-3d>
BetaaddEventListener
addEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa sensibile alle maiuscole e minuscole che rappresenta il tipo di evento da ascoltare.
  • listener:  EventListener|EventListenerObject l'oggetto che riceve una notifica. Deve essere una funzione o un oggetto con il metodo handleEvent
  • options:  boolean|AddEventListenerOptions optional vedi le opzioni. Gli eventi personalizzati supportano solo capture e passive.
Valore restituito:  void
Configura una funzione che verrà chiamata ogni volta che l'evento specificato viene inviato alla destinazione. Vedi addEventListener.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa che specifica il tipo di evento per cui rimuovere un listener di eventi.
  • listener:  EventListener|EventListenerObject Il listener di eventi del gestore di eventi da rimuovere dalla destinazione dell'evento.
  • options:  boolean|EventListenerOptions optional vedi le opzioni.
Valore restituito:  void
Rimuove dal target un listener di eventi registrato in precedenza con addEventListener. Vedi removeEventListener.

Interfaccia Polyline3DElementOptions

google.maps.maps3d.Polyline3DElementOptions interfaccia

Oggetto Polyline3DElementOptions utilizzato per definire le proprietà che possono essere impostate su un Polyline3DElement.
altitudeMode optional
Tipo:  AltitudeMode optional
Leggi i Polyline3DElement.altitudeMode.
coordinates optional
Leggi i Polyline3DElement.coordinates.
drawsOccludedSegments optional
Tipo:  boolean optional
Leggi i Polyline3DElement.drawsOccludedSegments.
extruded optional
Tipo:  boolean optional
Leggi i Polyline3DElement.extruded.
geodesic optional
Tipo:  boolean optional
Leggi i Polyline3DElement.geodesic.
outerColor optional
Tipo:  string optional
Leggi i Polyline3DElement.outerColor.
outerWidth optional
Tipo:  number optional
Leggi i Polyline3DElement.outerWidth.
strokeColor optional
Tipo:  string optional
Leggi i Polyline3DElement.strokeColor.
strokeWidth optional
Tipo:  number optional
Leggi i Polyline3DElement.strokeWidth.
zIndex optional
Tipo:  number optional
Leggi i Polyline3DElement.zIndex.

Polygon3DElement class

google.maps.maps3d.Polygon3DElement classe

Un poligono 3D (come una polilinea 3D) definisce una serie di coordinate connesse in una sequenza ordinata. Inoltre, i poligoni formano un anello chiuso e definiscono una regione piena.

Elemento personalizzato:
<gmp-polygon-3d altitude-mode="absolute" draws-occluded-segments extruded fill-color="string" geodesic stroke-color="string" stroke-width="number" z-index="number"></gmp-polygon-3d>

Questo corso si estende HTMLElement.

Questa classe implementa Polygon3DElementOptions.

Accesso chiamando il numero const {Polygon3DElement} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
Polygon3DElement
Polygon3DElement([options])
Parametri: 
Crea un Polygon3DElement con le opzioni specificate.
altitudeMode
Tipo:  AltitudeMode optional
Predefinito: AltitudeMode.ABSOLUTE
Specifica come vengono interpretati i componenti di altitudine nelle coordinate.
Attributo HTML:
  • <gmp-polygon-3d altitude-mode="absolute"></gmp-polygon-3d>
  • <gmp-polygon-3d altitude-mode="clamp-to-ground"></gmp-polygon-3d>
  • <gmp-polygon-3d altitude-mode="relative-to-ground"></gmp-polygon-3d>
  • <gmp-polygon-3d altitude-mode="relative-to-mesh"></gmp-polygon-3d>
drawsOccludedSegments
Tipo:  boolean optional
Predefinito: false
Specifica se le parti del poligono che potrebbero essere occluse vengono disegnate o meno. I poligoni possono essere occlusi dalla geometria della mappa (ad es. edifici).
Attributo HTML:
  • <gmp-polygon-3d draws-occluded-segments></gmp-polygon-3d>
extruded
Tipo:  boolean optional
Predefinito: false
Specifica se collegare il poligono al suolo. Per estrudere un poligono, altitudeMode deve essere RELATIVE_TO_GROUND o ABSOLUTE.
Attributo HTML:
  • <gmp-polygon-3d extruded></gmp-polygon-3d>
fillColor
Tipo:  string optional
Il colore di riempimento. Sono supportati tutti i colori CSS3.
Attributo HTML:
  • <gmp-polygon-3d fill-color="string"></gmp-polygon-3d>
geodesic
Tipo:  boolean optional
Predefinito: false
Quando true, i bordi del poligono vengono interpretati come geodetici e seguono la curvatura della Terra. Quando false, i bordi del poligono vengono visualizzati come linee rette nello spazio dello schermo.
Attributo HTML:
  • <gmp-polygon-3d geodesic></gmp-polygon-3d>
innerCoordinates
La sequenza ordinata di coordinate che designa un circuito chiuso. A differenza delle polilinee, un poligono può essere costituito da uno o più percorsi, che creano più ritagli all'interno del poligono.
outerCoordinates
La sequenza ordinata di coordinate che designa un circuito chiuso. L'altitudine viene ignorata in alcune modalità ed è quindi facoltativa.
strokeColor
Tipo:  string optional
Il colore del tratto. Sono supportati tutti i colori CSS3.
Attributo HTML:
  • <gmp-polygon-3d stroke-color="string"></gmp-polygon-3d>
strokeWidth
Tipo:  number optional
La larghezza del tratto in pixel.
Attributo HTML:
  • <gmp-polygon-3d stroke-width="number"></gmp-polygon-3d>
zIndex
Tipo:  number optional
L'indice z rispetto ad altri poligoni.
Attributo HTML:
  • <gmp-polygon-3d z-index="number"></gmp-polygon-3d>
BetaaddEventListener
addEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa sensibile alle maiuscole e minuscole che rappresenta il tipo di evento da ascoltare.
  • listener:  EventListener|EventListenerObject l'oggetto che riceve una notifica. Deve essere una funzione o un oggetto con il metodo handleEvent
  • options:  boolean|AddEventListenerOptions optional vedi le opzioni. Gli eventi personalizzati supportano solo capture e passive.
Valore restituito:  void
Configura una funzione che verrà chiamata ogni volta che l'evento specificato viene inviato alla destinazione. Vedi addEventListener.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parametri: 
  • type:  string una stringa che specifica il tipo di evento per cui rimuovere un listener di eventi.
  • listener:  EventListener|EventListenerObject Il listener di eventi del gestore di eventi da rimuovere dalla destinazione dell'evento.
  • options:  boolean|EventListenerOptions optional vedi le opzioni.
Valore restituito:  void
Rimuove dal target un listener di eventi registrato in precedenza con addEventListener. Vedi removeEventListener.

Interfaccia Polygon3DElementOptions

google.maps.maps3d.Polygon3DElementOptions interfaccia

Oggetto Polygon3DElementOptions utilizzato per definire le proprietà che possono essere impostate su un Polygon3DElement.
altitudeMode optional
Tipo:  AltitudeMode optional
Leggi i Polygon3DElement.altitudeMode.
drawsOccludedSegments optional
Tipo:  boolean optional
Leggi i Polygon3DElement.drawsOccludedSegments.
extruded optional
Tipo:  boolean optional
Leggi i Polygon3DElement.extruded.
fillColor optional
Tipo:  string optional
Leggi i Polygon3DElement.fillColor.
geodesic optional
Tipo:  boolean optional
Leggi i Polygon3DElement.geodesic.
innerCoordinates optional
Leggi i Polygon3DElement.innerCoordinates.
outerCoordinates optional
Leggi i Polygon3DElement.outerCoordinates.
strokeColor optional
Tipo:  string optional
Leggi i Polygon3DElement.strokeColor.
strokeWidth optional
Tipo:  number optional
Leggi i Polygon3DElement.strokeWidth.
zIndex optional
Tipo:  number optional
Leggi i Polygon3DElement.zIndex.

Costanti AltitudeMode

google.maps.maps3d.AltitudeMode costanti

Specifica come vengono interpretati i componenti di altitudine nelle coordinate.

Accesso chiamando il numero const {AltitudeMode} = await google.maps.importLibrary("maps3d").
Consulta Librerie nell'API Maps JavaScript.
ABSOLUTE Consente di esprimere gli oggetti rispetto al livello medio del mare. Ciò significa anche che se il livello di dettaglio del terreno cambia sotto l'oggetto, la sua posizione assoluta rimarrà invariata.
CLAMP_TO_GROUND Consente di esprimere gli oggetti posizionati a terra. Rimarranno a livello del suolo seguendo il terreno, indipendentemente dall'altitudine fornita. Se l'oggetto è posizionato sopra una grande massa d'acqua, verrà posizionato a livello del mare.
RELATIVE_TO_GROUND Consente di esprimere gli oggetti rispetto alla superficie del suolo. Se il livello di dettaglio del terreno cambia, la posizione dell'oggetto rimarrà costante rispetto al terreno. Quando si trova sopra l'acqua, l'altitudine viene interpretata come un valore in metri sopra il livello del mare.
RELATIVE_TO_MESH Consente di esprimere gli oggetti rispetto al punto più alto di terreno, edificio e superficie acquatica. Sopra l'acqua, questa sarà la superficie dell'acqua; sopra il terreno, questa sarà la superficie dell'edificio (se presente) o la superficie del terreno (se non ci sono edifici).