Info Window

Classe InfoWindow

google.maps.InfoWindow class
extends MVCObject
library "maps", "streetView"

Un overlay che assomiglia a un fumetto ed è spesso collegato a un indicatore.

const {InfoWindow} = await google.maps.importLibrary("maps");
 o 
const {InfoWindow} = await google.maps.importLibrary("streetView");
InfoWindow
InfoWindow([opts])
Parametri:
Crea una finestra informativa con le opzioni specificate. Un InfoWindow può essere posizionato su una mappa in una posizione specifica o sopra un indicatore, a seconda di ciò che è specificato nelle opzioni. A meno che la panoramica automatica non sia disattivata, un InfoWindow sposterà la mappa per rendersi visibile quando viene aperto. Dopo aver creato un InfoWindow, devi chiamare open per visualizzarlo sulla mappa. L'utente può fare clic sul pulsante Chiudi nella finestra informativa per rimuoverla dalla mappa oppure lo sviluppatore può chiamare close() per ottenere lo stesso effetto.
isOpen
readonly
Tipo: boolean
Controlla se la finestra informativa è aperta.
close
close()
Parametri: nessuno
Valore restituito: nessuno
Chiude questa InfoWindow rimuovendola dalla struttura DOM.
focus
focus()
Parametri: nessuno
Valore restituito: nessuno
Imposta lo stato attivo su questo InfoWindow. Potresti prendere in considerazione l'utilizzo di questo metodo insieme a un evento visible per assicurarti che InfoWindow sia visibile prima di impostare lo stato attivo su di esso. Un elemento InfoWindow non visibile non può essere impostato come attivo.
getContent
getContent()
Parametri: nessuno
Valore restituito: string|Element|Text|null|undefined il contenuto di questa InfoWindow. Lo stesso valore impostato in precedenza come contenuto.
getHeaderContent
getHeaderContent()
Parametri: nessuno
Valore restituito: string|Element|Text|null|undefined il contenuto dell'intestazione di questa InfoWindow. Vedi InfoWindowOptions.headerContent.
getHeaderDisabled
getHeaderDisabled()
Parametri: nessuno
Valore restituito: boolean|undefined indica se l'intera riga di intestazione è disattivata o meno. Vedi InfoWindowOptions.headerDisabled.
getPosition
getPosition()
Parametri: nessuno
Valore restituito: LatLng|null|undefined la posizione LatLng di questa InfoWindow.
getZIndex
getZIndex()
Parametri: nessuno
Valore restituito: number lo zIndex di questa InfoWindow.
open
open([options, anchor])
Parametri:
  • options: InfoWindowOpenOptions|Map|StreetViewPanorama optional un oggetto InfoWindowOpenOptions (consigliato) o la mappa|panorama su cui eseguire il rendering di questa InfoWindow.
  • anchor: MVCObject|AdvancedMarkerElement optional l'ancoraggio in cui verrà posizionata questa InfoWindow. Se l'ancoraggio non è nullo, l'oggetto InfoWindow verrà posizionato in alto al centro dell'ancoraggio. La finestra informativa verrà visualizzata sulla stessa mappa o panorama dell'ancoraggio (se disponibile).
Valore restituito: nessuno
Apre questa InfoWindow sulla mappa specificata. Facoltativamente, un InfoWindow può essere associato a un ancoraggio. Nell'API di base, l'unico ancoraggio è la classe Marker. Tuttavia, un ancoraggio può essere qualsiasi MVCObject che espone una proprietà LatLng position e, facoltativamente, una proprietà Point anchorPoint per calcolare pixelOffset (vedi InfoWindowOptions). anchorPoint è l'offset dalla posizione dell'ancoraggio alla punta della finestra informativa. Ti consigliamo di utilizzare l'interfaccia InfoWindowOpenOptions come unico argomento per questo metodo. Per impedire la modifica dello stato attivo del browser all'apertura, imposta InfoWindowOpenOptions.shouldFocus su false.
setContent
setContent([content])
Parametri:
  • content: string|Element|Text optional i contenuti da visualizzare in questa InfoWindow.
Valore restituito: nessuno
setHeaderContent
setHeaderContent([headerContent])
Parametri:
Valore restituito: nessuno
setHeaderDisabled
setHeaderDisabled([headerDisabled])
Parametri:
Valore restituito: nessuno
setOptions
setOptions([options])
Parametri:
Valore restituito: nessuno
setPosition
setPosition([position])
Parametri:
  • position: LatLng|LatLngLiteral optional la posizione LatLng in cui visualizzare questa InfoWindow.
Valore restituito: nessuno
setZIndex
setZIndex(zIndex)
Parametri:
  • zIndex: number Lo z-index di questa InfoWindow. Una finestra informativa con un valore z-index più alto verrà visualizzata davanti a tutte le altre finestre informative con un valore z-index più basso.
Valore restituito: nessuno
Ereditate: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
close
function()
Argomenti: nessuno
Questo evento viene attivato ogni volta che InfoWindow si chiude. Ad esempio, ciò potrebbe essere dovuto alla chiamata del metodo InfoWindow.close, alla pressione del tasto Esc per chiudere la finestra informativa, al clic sul pulsante di chiusura o allo spostamento della finestra informativa su un'altra mappa.
closeclick
function()
Argomenti: nessuno
Questo evento viene attivato quando viene fatto clic sul pulsante di chiusura.
content_changed
function()
Argomenti: nessuno
Questo evento viene attivato quando la proprietà dei contenuti cambia.
domready
function()
Argomenti: nessuno
Questo evento viene attivato quando l'elemento <div> contenente i contenuti di InfoWindow viene collegato al DOM. Potresti voler monitorare questo evento se stai creando i contenuti della finestra informativa in modo dinamico.
headercontent_changed
function()
Argomenti: nessuno
Questo evento viene attivato quando la proprietà headerContent cambia.
headerdisabled_changed
function()
Argomenti: nessuno
Questo evento viene attivato quando la proprietà headerDisabled cambia.
position_changed
function()
Argomenti: nessuno
Questo evento viene attivato quando la proprietà position cambia.
visible
function()
Argomenti: nessuno
Questo evento viene attivato quando InfoWindow è completamente visibile. Questo evento non viene attivato quando InfoWindow viene spostato fuori e poi di nuovo dentro lo schermo.
zindex_changed
function()
Argomenti: nessuno
Questo evento viene attivato quando cambia lo zIndex di InfoWindow.

Interfaccia InfoWindowOptions

Interfaccia google.maps.InfoWindowOptions

Oggetto InfoWindowOptions utilizzato per definire le proprietà che possono essere impostate su un InfoWindow.
ariaLabel
facoltativo
Tipo: string optional
AriaLabel da assegnare alla finestra informativa.
content
facoltativo
Tipo: string|Element|Text optional
Contenuto da visualizzare nella finestra informativa. Può essere un elemento HTML, una stringa di testo normale o una stringa contenente HTML. La finestra informativa verrà ridimensionata in base ai contenuti. Per impostare una dimensione esplicita per i contenuti, imposta i contenuti in modo che siano un elemento HTML con quella dimensione.
disableAutoPan
facoltativo
Tipo: boolean optional
Valore predefinito: false
Disattiva la panoramica della mappa per rendere InfoWindow completamente visibile quando si apre.
headerContent
facoltativo
Tipo: string|Element|Text optional
I contenuti da visualizzare nella riga di intestazione della finestra informativa. Può essere un elemento HTML o una stringa di testo normale. La finestra informativa verrà ridimensionata in base ai contenuti. Per impostare una dimensione esplicita per i contenuti dell'intestazione, imposta headerContent in modo che sia un elemento HTML con quella dimensione.
headerDisabled
facoltativo
Tipo: boolean optional
Disattiva l'intera riga di intestazione nella finestra informativa. Se impostata su true, l'intestazione verrà rimossa in modo che i contenuti dell'intestazione e il pulsante di chiusura vengano nascosti.
maxWidth
facoltativo
Tipo: number optional
Larghezza massima della finestra informativa, indipendentemente dalla larghezza dei contenuti. Questo valore viene preso in considerazione solo se viene impostato prima di una chiamata a open(). Per modificare la larghezza massima quando cambi i contenuti, chiama close(), setOptions() e poi open().
minWidth
facoltativo
Tipo: number optional
Larghezza minima della finestra informativa, indipendentemente dalla larghezza dei contenuti. Quando utilizzi questa proprietà, ti consigliamo vivamente di impostare minWidth su un valore inferiore alla larghezza della mappa (in pixel). Questo valore viene preso in considerazione solo se viene impostato prima di una chiamata a open(). Per modificare la larghezza minima quando cambi i contenuti, chiama close(), setOptions() e poi open().
pixelOffset
facoltativo
Tipo: Size optional
L'offset, in pixel, della punta della finestra informativa rispetto al punto sulla mappa alle cui coordinate geografiche è ancorata la finestra informativa. Se un InfoWindow viene aperto con un ancoraggio, pixelOffset verrà calcolato dalla proprietà anchorPoint dell'ancoraggio.
position
facoltativo
Tipo: LatLng|LatLngLiteral optional
L'oggetto LatLng in cui visualizzare questa InfoWindow. Se la finestra informativa viene aperta con un ancoraggio, verrà utilizzata la posizione dell'ancoraggio.
zIndex
facoltativo
Tipo: number optional
Tutte le finestre informative vengono visualizzate sulla mappa in ordine di zIndex, con i valori più alti visualizzati davanti alle finestre informative con valori più bassi. Per impostazione predefinita, le finestre informative vengono visualizzate in base alla loro latitudine, con le finestre informative di latitudini inferiori visualizzate davanti a quelle di latitudini superiori. Le finestre informative vengono sempre visualizzate davanti ai segnaposto.

Interfaccia InfoWindowOpenOptions

Interfaccia google.maps.InfoWindowOpenOptions

Opzioni per l'apertura di un InfoWindow
anchor
facoltativo
L'ancora in cui verrà posizionata questa InfoWindow. Se l'ancoraggio non è nullo, l'oggetto InfoWindow verrà posizionato in alto al centro dell'ancoraggio. La finestra informativa verrà visualizzata sulla stessa mappa o sullo stesso panorama dell'ancoraggio (se disponibile).
map
facoltativo
Tipo: Map|StreetViewPanorama optional
La mappa o la panoramica su cui eseguire il rendering di questa InfoWindow.
shouldFocus
facoltativo
Tipo: boolean optional
Indica se lo stato attivo deve essere spostato all'interno della finestra informativa quando viene aperta. Se questa proprietà non è impostata o se è impostata su null o undefined, viene utilizzata un'euristica per decidere se spostare o meno lo stato attivo. Ti consigliamo di impostare esplicitamente questa proprietà in base alle tue esigenze, poiché l'euristica è soggetta a modifiche e potrebbe non funzionare bene per tutti i casi d'uso.