InfoWindow-Klasse
google.maps.InfoWindow
Kurs
Ein Overlay, das wie eine Blase aussieht und oft mit einer Markierung verbunden ist.
Diese Klasse erweitert MVCObject
.
Rufen Sie const {InfoWindow} = await google.maps.importLibrary("maps")
oder const {InfoWindow} = await google.maps.importLibrary("streetView")
auf, um darauf zuzugreifen. Weitere Informationen finden Sie unter Bibliotheken in der Maps JavaScript API.
Konstruktor | |
---|---|
InfoWindow |
InfoWindow([opts]) Parameter:
Erstellt ein Infofenster mit den angegebenen Optionen. Ein Infofenster kann auf einer Karte, je nach angegebenen Optionen, an einer bestimmten Position oder oberhalb einer Markierung platziert werden. Ein InfoFenster schwenkt die Karte, so dass es beim Öffnen sichtbar wird, es sei denn, automatisches Schwenken ist inaktiviert. Nachdem Sie ein InfoWindow konstruiert haben, rufen Sie Öffnen auf, damit es auf der Karte angezeigt wird. Der Nutzer kann auf die Schaltfläche „Schließen“ in InfoWindow klicken, um es aus der Karte zu entfernen. Alternativ kann der Entwickler zum gleichen Zweck „close()“ aufrufen. |
Attribute | |
---|---|
isOpen |
Typ:
boolean Prüft, ob das Infofenster geöffnet ist. |
Methoden | |
---|---|
close |
close() Parameter:Keine
Rückgabewert:Keiner
Schließt dieses Infofenster, indem es aus der DOM-Struktur entfernt wird. |
focus |
focus() Parameter:Keine
Rückgabewert:Keiner
Legt den Fokus auf diese InfoWindow . Sie können diese Methode zusammen mit einem visible -Ereignis verwenden, um sicherzustellen, dass InfoWindow sichtbar ist, bevor der Fokus darauf festgelegt wird. Ein nicht sichtbarer InfoWindow kann nicht fokussiert werden. |
getContent |
getContent() Parameter:Keine
|
getHeaderContent |
getHeaderContent() Parameter:Keine
Rückgabewert:
string|Element|Text|null|undefined Der Inhalt des Infofeld-Headers. Siehe InfoWindowOptions.headerContent . |
getHeaderDisabled |
getHeaderDisabled() Parameter:Keine
Rückgabewert:
boolean|undefined Gibt an, ob die gesamte Kopfzeile deaktiviert ist oder nicht. Siehe InfoWindowOptions.headerDisabled . |
getPosition |
getPosition() Parameter:Keine
Rückgabewert:
LatLng|null|undefined Die LatLng-Position dieses Infofelds. |
getZIndex |
getZIndex() Parameter:Keine
Rückgabewert:
number Der Z-Index dieses Infofelds. |
open |
open([options, anchor]) Parameter:
Rückgabewert:Keiner
Öffnet dieses InfoWindow in der angegebenen Karte. Optional kann ein InfoWindow mit einem Anker verbunden werden. Im Kern-API ist der einzige Anker die Markierungsklasse. Ein Anker kann jedoch jedes MVCObject sein, das eine LatLng-Eigenschaft position und optional eine Punkt-Eigenschaft anchorPoint für die Berechnung der pixelOffset bereitstellt (siehe InfoWindowOptions). anchorPoint ist der Abstand von der Position des Ankers bis zur Spitze des Infofensters. Wir empfehlen, die InfoWindowOpenOptions -Schnittstelle als einziges Argument für diese Methode zu verwenden. Wenn der Browser beim Öffnen nicht den Fokus wechseln soll, setzen Sie InfoWindowOpenOptions.shouldFocus auf false . |
setContent |
setContent([content]) Parameter:
Rückgabewert:Keiner
|
setHeaderContent |
setHeaderContent([headerContent]) Parameter:
Rückgabewert:Keiner
|
setHeaderDisabled |
setHeaderDisabled([headerDisabled]) Parameter:
Rückgabewert:Keiner
|
setOptions |
setOptions([options]) Parameter:
Rückgabewert:Keiner
|
setPosition |
setPosition([position]) Parameter:
Rückgabewert:Keiner
|
setZIndex |
setZIndex(zIndex) Parameter:
Rückgabewert:Keiner
|
Übernommen:addListener ,
bindTo ,
get ,
notify ,
set ,
setValues ,
unbind ,
unbindAll
|
Ereignisse | |
---|---|
close |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn die InfoWindow geschlossen wird. Das kann beispielsweise durch Aufrufen der InfoWindow.close -Methode, Drücken der Esc-Taste zum Schließen des Infofensters, Klicken auf die Schaltfläche „Schließen“ oder Verschieben des Infofensters auf eine andere Karte geschehen. |
closeclick |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn auf die Schalfläche Schließen geklickt wurde. |
content_changed |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn sich die Eigenschaft Inhalt ändert. |
domready |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn das <div> , das den Inhalt des InfoWindow enthält, an das DOM angehängt wird. Möglicherweise möchten Sie dieses Ereignis überwachen, falls Sie Ihren Infofenster-Inhalt dynamisch erstellen. |
headercontent_changed |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn sich die Property „headerContent“ ändert. |
headerdisabled_changed |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn sich die Eigenschaft „headerDisabled“ ändert. |
position_changed |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn sich die Eigenschaft Position ändert. |
visible |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn die InfoWindow vollständig sichtbar ist. Dieses Ereignis wird nicht ausgelöst, wenn InfoWindow aus dem Bild heraus- und wieder hineingezoomt wird. |
zindex_changed |
function() Argumente:Keine
Dieses Ereignis wird ausgelöst, wenn sich der Z-Index von InfoWindow ändert. |
InfoWindowOptions-Schnittstelle
google.maps.InfoWindowOptions
Benutzeroberfläche
Das InfoWindowOptions-Objekt wird verwendet, um die Properties zu definieren, die für ein Infofenster festgelegt werden können.
Attribute | |
---|---|
ariaLabel optional |
Typ:
string optional AriaLabel, das dem Infofenster zugewiesen werden soll. |
content optional |
Im InfoFenster anzuzeigender Inhalt. Dies kann ein HTML-Element sein, eine reine Zeichenfolge oder eine Zeichenfolge, die HTML enthält. Die Größe des InfoFensters wird seinem Inhalt angepasst. Um ausdrücklich eine Größe für den Inhalt zu bestimmen, legen Sie fest, dass der Inhalt ein HTML-Element mit dieser Größe sein soll. |
disableAutoPan optional |
Typ:
boolean optional Standard:
false Deaktivieren Sie das Schwenken der Karte, damit das Infofenster beim Öffnen vollständig sichtbar ist. |
headerContent optional |
Der Inhalt, der in der Kopfzeile des Infofensters angezeigt werden soll. Dies kann ein HTML-Element oder ein String aus Nur-Text sein. Die Größe des InfoFensters wird seinem Inhalt angepasst. Wenn Sie eine explizite Größe für den Inhalt der Überschrift festlegen möchten, legen Sie „headerContent“ als HTML-Element mit dieser Größe fest. |
headerDisabled optional |
Typ:
boolean optional Deaktiviert die gesamte Kopfzeile im Infofeld. Wenn „true“ festgelegt ist, wird der Header entfernt, sodass der Inhalt des Headers und die Schaltfläche zum Schließen ausgeblendet werden. |
maxWidth optional |
Typ:
number optional Maximale Breite des Infofelds, unabhängig von der Breite des Inhalts. Dieser Wert wird nur berücksichtigt, wenn er vor einem Aufruf von open() festgelegt wird. Wenn Sie die maximale Breite beim Ändern des Inhalts ändern möchten, rufen Sie close() , setOptions() und dann open() auf. |
minWidth optional |
Typ:
number optional Mindestbreite des Infofelds, unabhängig von der Breite des Inhalts. Wenn Sie dieses Attribut verwenden, sollten Sie minWidth auf einen Wert festlegen, der kleiner als die Breite der Karte (in Pixeln) ist. Dieser Wert wird nur berücksichtigt, wenn er vor einem Aufruf von open() festgelegt wird. Wenn Sie die Mindestbreite beim Ändern des Inhalts ändern möchten, rufen Sie close() , setOptions() und dann open() auf. |
pixelOffset optional |
Typ:
Size optional Der Abstand in Pixeln zwischen der Spitze des Infofensters und dem Punkt auf der Karte, an dessen geografischen Koordinaten das Infofenster verankert ist. Wenn ein Infofenster mit einem Anker geöffnet wird, wird pixelOffset anhand der anchorPoint -Eigenschaft des Ankers berechnet. |
position optional |
Typ:
LatLng|LatLngLiteral optional Der LatLng-Wert, bei der diesem InfoWindow angezeigt werden soll. Wenn das Infofenster mit einem Anker geöffnet wird, wird stattdessen die Position des Ankers verwendet. |
zIndex optional |
Typ:
number optional Sämtliche InfoWindow-Elemente werden auf der Karte in der Reihenfolge ihrer zIndex angezeigt, wobei InfoWindow-Elemente mit höheren Werten vor InfoWindow-Elementen mit niedrigeren Werten rangieren. Standardmäßig werden Infofelder nach ihrem Breitengrad angezeigt. Infofelder mit niedrigeren Breitengraden werden vor Infofeldern mit höheren Breitengraden angezeigt. InfoWindows-Elemente werden immer vor Markierungen angezeigt. |
Schnittstelle InfoWindowOpenOptions
google.maps.InfoWindowOpenOptions
Benutzeroberfläche
Optionen zum Öffnen eines Infofensters
Attribute | |
---|---|
anchor optional |
Typ:
MVCObject|AdvancedMarkerElement optional Der Anker, an dem dieses Infofenster positioniert wird. Wenn der Anker nicht null ist, wird das Infofenster oben in der Mitte des Ankers platziert. Das Infofenster wird auf derselben Karte oder im selben Panorama wie der Anker gerendert, sofern verfügbar. |
map optional |
Typ:
Map|StreetViewPanorama optional Die Karte oder das Panorama, auf dem dieses Infofenster gerendert werden soll. |
shouldFocus optional |
Typ:
boolean optional Gibt an, ob der Fokus innerhalb des Infofensters verschoben werden soll, wenn es geöffnet wird. Wenn diese Property nicht festgelegt oder auf null oder undefined gesetzt ist, wird anhand einer Heuristik entschieden, ob der Fokus verschoben werden soll. Wir empfehlen, diese Property explizit an Ihre Anforderungen anzupassen, da sich die Heuristik ändern kann und möglicherweise nicht für alle Anwendungsfälle geeignet ist. |