Google verwendet KI-Technologie, um Inhalte in Ihre bevorzugte Sprache zu übersetzen. KI-Übersetzungen können Fehler enthalten.

Places Widgets

PlaceAutocompleteElement-Klasse

class google.maps.places.PlaceAutocompleteElement extends HTMLElement implements PlaceAutocompleteElementOptions
library "places"

„PlaceAutocompleteElement“ ist eine Unterklasse von HTMLElement, die eine UI-Komponente für die Places Autocomplete API bereitstellt.

AutocompleteSessionTokens werden von „PlaceAutocompleteElement“ automatisch intern verwendet, um die Abfrage- und Auswahlphasen einer Nutzeranfrage zur automatischen Vervollständigung zu gruppieren.

Beim ersten Aufruf von Place.fetchFields für ein Place, das von PlacePrediction.toPlace zurückgegeben wurde, wird automatisch das Sitzungstoken verwendet, das zum Abrufen des PlacePrediction verwendet wurde.

Weitere Informationen zur Funktionsweise von Sitzungstokens finden Sie unter https://developers.google.com/maps/documentation/places/web-service/place-session-tokens.

<gmp-place-autocomplete
  description="string"
  disabled
  future-opening-businesses-included
  included-primary-types="type1 type2 type3..."
  included-region-codes="c1 c2 c3..."
  internal-usage-attribution-ids="space separated strings"
  maxlength="number"
  name="string"
  no-clear-button
  no-input-icon
  origin="lat,lng"
  placeholder="string"
  pure-service-area-businesses-included
  readonly
  requested-language="string"
  requested-region="string"
  unit-system="value-name">
</gmp-place-autocomplete>

const {PlaceAutocompleteElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceAutocompleteElement`	`PlaceAutocompleteElement([options])` Parameter: `options: PlaceAutocompleteElementOptions optional`

Attribute
`description` attr: description	Typ: `string optional` Die Beschreibung, die für das Eingabeelement verwendet werden soll. Dies wird von Screenreadern erkannt, wenn das Eingabeelement fokussiert ist. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-describedby. HTML-Attribut: `description="string"`
`disabled` attr: disabled	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob das Eingabeelement deaktiviert ist. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#disabled. HTML-Attribut: `disabled`
`futureOpeningBusinessesIncluded` attr: future-opening-businesses-included	Typ: `boolean optional` Gibt an, ob Orte einbezogen werden sollen, die noch nicht geöffnet sind, aber voraussichtlich in Zukunft geöffnet werden. HTML-Attribut: `future-opening-businesses-included`
`includedPrimaryTypes` attr: included-primary-types	Typ: `Array<string> optional` Eingeschlossener primärer Ortstyp (z. B. „restaurant“ oder „gas_station“). Ein Ort wird nur zurückgegeben, wenn sein primärer Typ in dieser Liste enthalten ist. Sie können bis zu fünf Werte angeben. Wenn keine Typen angegeben sind, werden alle Ortstypen zurückgegeben. HTML-Attribut: `included-primary-types="type1 type2 type3..."`
`includedRegionCodes` attr: included-region-codes	Typ: `Array<string> optional` Nur Ergebnisse in den angegebenen Regionen einschließen, angegeben als bis zu 15 zweistellige CLDR-Regionscodes. Ein leerer Satz schränkt die Ergebnisse nicht ein. Wenn sowohl `locationRestriction` als auch `includedRegionCodes` festgelegt sind, befinden sich die Ergebnisse im Schnittbereich. HTML-Attribut: `included-region-codes="c1 c2 c3..."`
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`locationBias`	Typ: `LocationBias optional` Eine weiche Grenze oder ein Hinweis, der bei der Suche nach Orten verwendet werden soll.
`locationRestriction`	Typ: `LocationRestriction optional` Grenzen, um die Suchergebnisse einzuschränken.
`maxlength` attr: maxlength	Typ: `number optional` Die maximale Anzahl von Zeichen, die der Nutzer eingeben kann. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#maxlength. HTML-Attribut: `maxlength="number"`
`name` attr: name	Typ: `string optional` Der Name, der für das Eingabeelement verwendet werden soll. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name. Folgt demselben Verhalten wie das Attribut „name“ für Eingaben. Dieser Name wird verwendet, wenn ein Formular gesendet wird. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form. HTML-Attribut: `name="string"`
`noClearButton` attr: no-clear-button	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob die Schaltfläche zum Löschen ausgeblendet werden soll. HTML-Attribut: `no-clear-button`
`noInputIcon` attr: no-input-icon	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob das Eingabesymbol ausgeblendet werden soll. HTML-Attribut: `no-input-icon`
`origin` attr: origin	Eingabetyp: `LatLng\|LatLngLiteral\|LatLngAltitude\|LatLngAltitudeLiteral optional` Ausgabetyp: `LatLngAltitude optional` Der Ursprung, von dem aus die Entfernung berechnet werden soll. Wenn keine Angabe erfolgt, wird die Entfernung nicht berechnet. Die Höhe wird, falls angegeben, nicht in die Berechnung einbezogen. HTML-Attribut: `origin="lat,lng"` `origin="lat,lng,altitude"`
`placeholder` attr: placeholder	Typ: `string optional` Der Platzhaltertext, der für das Eingabeelement verwendet werden soll. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#placeholder. HTML-Attribut: `placeholder="string"`
`pureServiceAreaBusinessesIncluded` attr: pure-service-area-businesses-included	Typ: `boolean optional` Gibt an, ob Orte einbezogen werden sollen, die reine Unternehmen ohne festen Standort in einem Einzugsgebiet sind. HTML-Attribut: `pure-service-area-businesses-included`
`readonly` attr: readonly	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob das Eingabeelement schreibgeschützt ist. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#readonly. HTML-Attribut: `readonly`
`requestedLanguage` attr: requested-language	Typ: `string optional` Eine Sprachkennung für die Sprache, in der die Ergebnisse nach Möglichkeit zurückgegeben werden sollen. Ergebnisse in der ausgewählten Sprache werden möglicherweise höher eingestuft, Vorschläge sind jedoch nicht auf diese Sprache beschränkt. Hier finden Sie eine Liste der unterstützten Sprachen. HTML-Attribut: `requested-language="string"`
`requestedRegion` attr: requested-region	Typ: `string optional` Ein Regionscode, der für die Formatierung und Filterung der Ergebnisse verwendet wird. Die Vorschläge werden nicht auf dieses Land beschränkt. Für den Regionscode ist ein zweistelliger Wert für die ccTLD („Top-Level-Domain“) zulässig. Die meisten ccTLD-Codes entsprechen den ISO 3166-1-Codes, mit folgenden Ausnahmen. So lautet beispielsweise die ccTLD des Vereinigten Königreichs „uk“ (`.co.uk`), der ISO 3166-1-Code dagegen „gb“ (technisch gesehen für das Vereinigte Königreich Großbritannien und Nordirland). HTML-Attribut: `requested-region="string"`
`unitSystem` attr: unit-system	Eingabetyp: `UnitSystem optional` Ausgabetyp: `UnitSystem optional` Das Einheitensystem, das für die Anzeige von Entfernungen verwendet wird. Wenn nicht angegeben, wird das Einheitensystem durch „requestedRegion“ bestimmt. HTML-Attribut: `unit-system="value-name"`
`value`	Eingabetyp: `string optional` Ausgabetyp: `string` Der Wert des Eingabeelements.

Slots
`clear-icon`	Platziert das Element mit Slot an der Position des Symbols zum Löschen. Die Schaltfläche zum Löschen wird am Ende des Eingabefelds angezeigt, wenn Text im Eingabefeld vorhanden ist.
`input-icon`	Platziert das Slotted-Element an der Position des Eingabesymbols. Das Eingabesymbol wird im Inline-Modus am Anfang des Eingabefelds angezeigt.
`prediction-item-icon`	Dieser Slot akzeptiert genau ein `<template>`-Element, das als Symbol neben dem Vervollständigungselement gerendert wird.

Teile
`focus-ring`	Das Element, mit dem der Fokusring um das fokussierte Element (Eingabe- oder Vervollständigungselemente) angezeigt wird
`input`	Das Eingabeelement für das Autocomplete-Element.
`prediction-item`	Ein Element im Drop-down-Menü der Vorschläge, das einen einzelnen Vorschlag darstellt.
`prediction-item-icon`	Das links von jedem Element in der Liste der Vorhersagen angezeigte Symbol.
`prediction-item-main-text`	Ein Teil des Vorschlagselements, der den Haupttext des Vorschlags darstellt. Bei geografischen Standorten enthält es einen Ortsnamen wie "Sydney" oder einen Straßennamen und eine Hausnummer wie "Königsstraße 10". Standardmäßig ist der prediction-item-main-text schwarz. Wenn zusätzlicher Text in „prediction-item“ vorhanden ist, befindet er sich außerhalb von „prediction-item-main-text“ und übernimmt den Stil von „prediction-item“. Standardmäßig wird das Element grau dargestellt. Der zusätzliche Text ist in der Regel eine Adresse.
`prediction-item-match`	Der Teil der gelieferten Vervollständigung, der der Eingabe des Nutzers entspricht. Standardmäßig wird dieser übereinstimmende Text durch Fettformatierung hervorgehoben. Der übereinstimmende Text wird nur innerhalb von prediction-item-main-text hervorgehoben.
`prediction-item-nonmatch`	Der Teil des Haupttextes der Vorhersage, der nicht mit der Eingabe des Nutzers übereinstimmt.
`prediction-item-secondary-text`	Ein Teil des prediction-item-Elements, der den sekundären Text des Vorschlags darstellt. Der zusätzliche Text ist in der Regel eine Adresse.
`prediction-item-selected`	Das Element, das zu sehen ist, wenn der Nutzer es über die Tastatur auswählt. Hinweis: Die ausgewählten Elemente sind sowohl von diesen Teilestilen als auch von den Teilestilen für Vorhersageelemente betroffen.
`prediction-list`	Das visuelle Element, das die Liste der Vorhersagen enthält, die vom Place Autocomplete-Dienst zurückgegeben wurden. Diese Liste wird als Drop-down-Liste unter dem PlaceAutocompleteElement angezeigt.

CSS-Eigenschaften
`background-color`	Überschreibt die Hintergrundfarbe des Elements.
`border`	Überschreibt den Rahmen des Elements.
`border-radius`	Überschreibt den Rahmenradius des Elements.
`color`	Überschreibt die Schriftart des Elements.
`color-scheme`	Gibt an, in welchem Farbschema dieses Element gerendert werden kann. Weitere Informationen finden Sie in der `color-scheme`-Dokumentation. Die Standardeinstellung ist `color-scheme: light dark`.
`font`	Überschreibt die Schriftart des Elements.
`font-family`	Überschreibt die Schriftart des Elements.
`font-size`	Überschreibt die Schriftart des Elements.
`font-style`	Überschreibt die Schriftart des Elements.
`font-weight`	Überschreibt die Schriftart des Elements.
`line-height`	Überschreibt die Schriftart des Elements.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
`gmp-error`	`function(errorEvent)` Argumente: `errorEvent: Event optional` Dieses Ereignis wird ausgelöst, wenn eine Anfrage an das Backend abgelehnt wurde (z.B. falscher API-Schlüssel). Dieses Ereignis wird nicht weitergegeben.
`gmp-select`	`function(placePredictionSelectEvent)` Argumente: `placePredictionSelectEvent: PlacePredictionSelectEvent optional` Dieses Ereignis wird ausgelöst, wenn ein Nutzer einen Ortsvorschlag auswählt. Enthält ein PlacePrediction-Objekt, das in ein Place-Objekt konvertiert werden kann.

Schnittstelle PlaceAutocompleteElementOptions

Schnittstelle google.maps.places.PlaceAutocompleteElementOptions
implementiert von PlaceAutocompleteElement

Optionen zum Erstellen eines PlaceAutocompleteElement. Eine Beschreibung der einzelnen Attribute finden Sie unter dem gleichnamigen Attribut in der Klasse „PlaceAutocompleteElement“.

Attribute
`description` optional	Typ: `string optional` Die Beschreibung, die für das Eingabeelement verwendet werden soll. Dies wird von Screenreadern erkannt, wenn das Eingabeelement fokussiert ist.
`disabled` optional	Typ: `boolean optional`
`futureOpeningBusinessesIncluded` optional	Typ: `boolean optional`
`includedPrimaryTypes` optional	Typ: `Array<string> optional`
`includedRegionCodes` optional	Typ: `Array<string> optional`
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional`
`locationBias` optional	Typ: `LocationBias optional`
`locationRestriction` optional	Typ: `LocationRestriction optional`
`maxlength` optional	Typ: `number optional`
`name` optional	Typ: `string optional`
`noClearButton` optional	Typ: `boolean optional`
`noInputIcon` optional	Typ: `boolean optional`
`origin` optional	Typ: `LatLng\|LatLngLiteral\|LatLngAltitude\|LatLngAltitudeLiteral optional`
`placeholder` optional	Typ: `string optional`
`pureServiceAreaBusinessesIncluded` optional	Typ: `boolean optional`
`readonly` optional	Typ: `boolean optional`
`requestedLanguage` optional	Typ: `string optional`
`requestedRegion` optional	Typ: `string optional`
`unitSystem` optional	Typ: `UnitSystem optional`
`value` optional	Typ: `string optional` Der Wert des Eingabeelements.

PlacePredictionSelectEvent-Klasse

Klasse google.maps.places.PlacePredictionSelectEvent erweitert Event
Bibliothek "places"

Dieses Ereignis wird erstellt, nachdem der Nutzer ein Vervollständigungselement mit dem PlaceAutocompleteElement ausgewählt hat. Greifen Sie mit event.placePrediction auf die Auswahl zu.

Wandeln Sie „placePrediction“ in ein Place um, indem Sie PlacePrediction.toPlace aufrufen.

const {PlacePredictionSelectEvent} = await google.maps.importLibrary("places");

Attribute
`placePrediction` readonly	Typ: `PlacePrediction` Konvertieren Sie dies in ein `Place`, indem Sie `PlacePrediction.toPlace` aufrufen.

BasicPlaceAutocompleteElement-Klasse

class google.maps.places.BasicPlaceAutocompleteElement extends HTMLElement implements BasicPlaceAutocompleteElementOptions
library "places"

„BasicPlaceAutocompleteElement“ ist eine HTMLElement-Unterklasse, die eine UI-Komponente für die Places Autocomplete API bereitstellt.

<gmp-basic-place-autocomplete
  description="string"
  disabled
  future-opening-businesses-included
  included-primary-types="type1 type2 type3..."
  included-region-codes="c1 c2 c3..."
  internal-usage-attribution-ids="space separated strings"
  maxlength="number"
  name="string"
  no-clear-button
  no-input-icon
  origin="lat,lng"
  placeholder="string"
  pure-service-area-businesses-included
  readonly
  requested-language="string"
  requested-region="string"
  unit-system="value-name">
</gmp-basic-place-autocomplete>

const {BasicPlaceAutocompleteElement} = await google.maps.importLibrary("places");

Konstruktor
`BasicPlaceAutocompleteElement`	`BasicPlaceAutocompleteElement([options])` Parameter: `options: BasicPlaceAutocompleteElementOptions optional`

Attribute
`description` attr: description	Typ: `string optional` Die Beschreibung, die für das Eingabeelement verwendet werden soll. Dies wird von Screenreadern erkannt, wenn das Eingabeelement fokussiert ist. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-describedby. HTML-Attribut: `description="string"`
`disabled` attr: disabled	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob das Eingabeelement deaktiviert ist. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#disabled. HTML-Attribut: `disabled`
`futureOpeningBusinessesIncluded` attr: future-opening-businesses-included	Typ: `boolean optional` Gibt an, ob Orte einbezogen werden sollen, die noch nicht geöffnet sind, aber voraussichtlich in Zukunft geöffnet werden. HTML-Attribut: `future-opening-businesses-included`
`includedPrimaryTypes` attr: included-primary-types	Typ: `Array<string> optional` Eingeschlossener primärer Ortstyp (z. B. „restaurant“ oder „gas_station“). Ein Ort wird nur zurückgegeben, wenn sein primärer Typ in dieser Liste enthalten ist. Sie können bis zu fünf Werte angeben. Wenn keine Typen angegeben sind, werden alle Ortstypen zurückgegeben. HTML-Attribut: `included-primary-types="type1 type2 type3..."`
`includedRegionCodes` attr: included-region-codes	Typ: `Array<string> optional` Nur Ergebnisse in den angegebenen Regionen einschließen, angegeben als bis zu 15 zweistellige CLDR-Regionscodes. Ein leerer Satz schränkt die Ergebnisse nicht ein. Wenn sowohl `locationRestriction` als auch `includedRegionCodes` festgelegt sind, befinden sich die Ergebnisse im Schnittbereich. HTML-Attribut: `included-region-codes="c1 c2 c3..."`
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`locationBias`	Typ: `LocationBias optional` Eine weiche Grenze oder ein Hinweis, der bei der Suche nach Orten verwendet werden soll.
`locationRestriction`	Typ: `LocationRestriction optional` Grenzen, um die Suchergebnisse einzuschränken.
`maxlength` attr: maxlength	Typ: `number optional` Die maximale Anzahl von Zeichen, die der Nutzer eingeben kann. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#maxlength. HTML-Attribut: `maxlength="number"`
`name` attr: name	Typ: `string optional` Der Name, der für das Eingabeelement verwendet werden soll. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name. Folgt demselben Verhalten wie das Attribut „name“ für Eingaben. Dieser Name wird verwendet, wenn ein Formular gesendet wird. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form. HTML-Attribut: `name="string"`
`noClearButton` attr: no-clear-button	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob die Schaltfläche zum Löschen ausgeblendet werden soll. HTML-Attribut: `no-clear-button`
`noInputIcon` attr: no-input-icon	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob das Eingabesymbol ausgeblendet werden soll. HTML-Attribut: `no-input-icon`
`origin` attr: origin	Eingabetyp: `LatLng\|LatLngLiteral\|LatLngAltitude\|LatLngAltitudeLiteral optional` Ausgabetyp: `LatLngAltitude optional` Der Ursprung, von dem aus die Entfernung berechnet werden soll. Wenn keine Angabe erfolgt, wird die Entfernung nicht berechnet. Die Höhe wird, falls angegeben, nicht in die Berechnung einbezogen. HTML-Attribut: `origin="lat,lng"` `origin="lat,lng,altitude"`
`placeholder` attr: placeholder	Typ: `string optional` Der Platzhaltertext, der für das Eingabeelement verwendet werden soll. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#placeholder. HTML-Attribut: `placeholder="string"`
`pureServiceAreaBusinessesIncluded` attr: pure-service-area-businesses-included	Typ: `boolean optional` Gibt an, ob Orte einbezogen werden sollen, die reine Unternehmen ohne festen Standort in einem Einzugsgebiet sind. HTML-Attribut: `pure-service-area-businesses-included`
`readonly` attr: readonly	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob das Eingabeelement schreibgeschützt ist. Weitere Informationen finden Sie unter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#readonly. HTML-Attribut: `readonly`
`requestedLanguage` attr: requested-language	Typ: `string optional` Eine Sprachkennung für die Sprache, in der die Ergebnisse nach Möglichkeit zurückgegeben werden sollen. Ergebnisse in der ausgewählten Sprache werden möglicherweise höher eingestuft, Vorschläge sind jedoch nicht auf diese Sprache beschränkt. Hier finden Sie eine Liste der unterstützten Sprachen. HTML-Attribut: `requested-language="string"`
`requestedRegion` attr: requested-region	Typ: `string optional` Ein Regionscode, der für die Formatierung und Filterung der Ergebnisse verwendet wird. Die Vorschläge werden nicht auf dieses Land beschränkt. Für den Regionscode ist ein zweistelliger Wert für die ccTLD („Top-Level-Domain“) zulässig. Die meisten ccTLD-Codes entsprechen den ISO 3166-1-Codes, mit folgenden Ausnahmen. So lautet beispielsweise die ccTLD des Vereinigten Königreichs „uk“ (`.co.uk`), der ISO 3166-1-Code dagegen „gb“ (technisch gesehen für das Vereinigte Königreich Großbritannien und Nordirland). HTML-Attribut: `requested-region="string"`
`unitSystem` attr: unit-system	Eingabetyp: `UnitSystem optional` Ausgabetyp: `UnitSystem optional` Das Einheitensystem, das für die Anzeige von Entfernungen verwendet wird. Wenn nicht angegeben, wird das Einheitensystem durch „requestedRegion“ bestimmt. HTML-Attribut: `unit-system="value-name"`

Slots
`clear-icon`	Platziert das Element mit Slot an der Position des Symbols zum Löschen. Die Schaltfläche zum Löschen wird am Ende des Eingabefelds angezeigt, wenn Text im Eingabefeld vorhanden ist.
`input-icon`	Platziert das Slotted-Element an der Position des Eingabesymbols. Das Eingabesymbol wird im Inline-Modus am Anfang des Eingabefelds angezeigt.
`prediction-item-icon`	Dieser Slot akzeptiert genau ein `<template>`-Element, das als Symbol neben dem Vervollständigungselement gerendert wird.

Teile
`focus-ring`	Das Element, mit dem der Fokusring um das fokussierte Element (Eingabe- oder Vervollständigungselemente) angezeigt wird
`input`	Das Eingabeelement für das Autocomplete-Element.
`prediction-item`	Ein Element im Drop-down-Menü der Vorschläge, das einen einzelnen Vorschlag darstellt.
`prediction-item-icon`	Das links von jedem Element in der Liste der Vorhersagen angezeigte Symbol.
`prediction-item-main-text`	Ein Teil des Vorschlagselements, der den Haupttext des Vorschlags darstellt. Bei geografischen Standorten enthält es einen Ortsnamen wie "Sydney" oder einen Straßennamen und eine Hausnummer wie "Königsstraße 10". Standardmäßig ist der prediction-item-main-text schwarz. Wenn zusätzlicher Text in „prediction-item“ vorhanden ist, befindet er sich außerhalb von „prediction-item-main-text“ und übernimmt den Stil von „prediction-item“. Standardmäßig wird das Element grau dargestellt. Der zusätzliche Text ist in der Regel eine Adresse.
`prediction-item-match`	Der Teil der gelieferten Vervollständigung, der der Eingabe des Nutzers entspricht. Standardmäßig wird dieser übereinstimmende Text durch Fettformatierung hervorgehoben. Der übereinstimmende Text wird nur innerhalb von prediction-item-main-text hervorgehoben.
`prediction-item-nonmatch`	Der Teil des Haupttextes der Vorhersage, der nicht mit der Eingabe des Nutzers übereinstimmt.
`prediction-item-secondary-text`	Ein Teil des prediction-item-Elements, der den sekundären Text des Vorschlags darstellt. Der zusätzliche Text ist in der Regel eine Adresse.
`prediction-item-selected`	Das Element, das zu sehen ist, wenn der Nutzer es über die Tastatur auswählt. Hinweis: Die ausgewählten Elemente sind sowohl von diesen Teilestilen als auch von den Teilestilen für Vorhersageelemente betroffen.
`prediction-list`	Das visuelle Element, das die Liste der Vorhersagen enthält, die vom Place Autocomplete-Dienst zurückgegeben wurden. Diese Liste wird als Drop-down-Liste unter dem PlaceAutocompleteElement angezeigt.

CSS-Eigenschaften
`background-color`	Überschreibt die Hintergrundfarbe des Elements.
`border`	Überschreibt den Rahmen des Elements.
`border-radius`	Überschreibt den Rahmenradius des Elements.
`color`	Überschreibt die Schriftart des Elements.
`color-scheme`	Gibt an, in welchem Farbschema dieses Element gerendert werden kann. Weitere Informationen finden Sie in der `color-scheme`-Dokumentation. Die Standardeinstellung ist `color-scheme: light dark`.
`font`	Überschreibt die Schriftart des Elements.
`font-family`	Überschreibt die Schriftart des Elements.
`font-size`	Überschreibt die Schriftart des Elements.
`font-style`	Überschreibt die Schriftart des Elements.
`font-weight`	Überschreibt die Schriftart des Elements.
`line-height`	Überschreibt die Schriftart des Elements.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
`gmp-error`	`function(errorEvent)` Argumente: `errorEvent: Event optional` Dieses Ereignis wird ausgelöst, wenn eine Anfrage an das Backend abgelehnt wurde (z.B. falscher API-Schlüssel). Dieses Ereignis wird nicht weitergegeben.
`gmp-select`	`function(placeSelectEvent)` Argumente: `placeSelectEvent: PlaceSelectEvent optional` Dieses Ereignis wird ausgelöst, wenn ein Nutzer einen Ortsvorschlag auswählt. Enthält ein Place-Objekt.

BasicPlaceAutocompleteElementOptions-Schnittstelle

Schnittstelle google.maps.places.BasicPlaceAutocompleteElementOptions
implementiert von BasicPlaceAutocompleteElement

Optionen zum Erstellen eines BasicPlaceAutocompleteElement.

Attribute
`description` optional	Typ: `string optional` Die Beschreibung, die für das Eingabeelement verwendet werden soll. Dies wird von Screenreadern erkannt, wenn das Eingabeelement fokussiert ist.
`disabled` optional	Typ: `boolean optional`
`futureOpeningBusinessesIncluded` optional	Typ: `boolean optional`
`includedPrimaryTypes` optional	Typ: `Array<string> optional`
`includedRegionCodes` optional	Typ: `Array<string> optional`
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional`
`locationBias` optional	Typ: `LocationBias optional`
`locationRestriction` optional	Typ: `LocationRestriction optional`
`maxlength` optional	Typ: `number optional`
`name` optional	Typ: `string optional`
`noClearButton` optional	Typ: `boolean optional`
`noInputIcon` optional	Typ: `boolean optional`
`origin` optional	Typ: `LatLng\|LatLngLiteral\|LatLngAltitude\|LatLngAltitudeLiteral optional`
`placeholder` optional	Typ: `string optional`
`pureServiceAreaBusinessesIncluded` optional	Typ: `boolean optional`
`readonly` optional	Typ: `boolean optional`
`requestedLanguage` optional	Typ: `string optional`
`requestedRegion` optional	Typ: `string optional`
`unitSystem` optional	Typ: `UnitSystem optional`

Klasse PlaceDetailsElement

Klasse google.maps.places.PlaceDetailsElement erweitert HTMLElement implementiert PlaceDetailsElementOptions
erweitert durch AdvancedPlaceDetailsElement
Bibliothek "places"

Zeigt Details zu einem Ort in einem vollständigen Layout an. Hängen Sie entweder PlaceDetailsPlaceRequestElement oder PlaceDetailsLocationRequestElement an, um den Ort anzugeben, der gerendert werden soll. Hängen Sie PlaceContentConfigElement, PlaceStandardContentElement oder PlaceAllContentElement an, um anzugeben, welche Inhalte gerendert werden sollen.

Beispiel:

 <gmp-place-details>
   <gmp-place-details-place-request
     place="PLACE_ID"
   ></gmp-place-details-place-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-details>

Wenn Sie dieses Element verwenden möchten, müssen Sie die Places UI Kit API für Ihr Projekt in der Google Cloud Console aktivieren.

<gmp-place-details
  internal-usage-attribution-ids="space separated strings">
</gmp-place-details>

const {PlaceDetailsElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceDetailsElement`	`PlaceDetailsElement([options])` Parameter: `options: PlaceDetailsElementOptions optional`

Attribute
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`place` readonly	Typ: `Place optional` Schreibgeschützt. Place-Objekt mit der ID, dem Standort und dem Darstellungsbereich des aktuell gerenderten Orts.

CSS-Eigenschaften
`--gmp-button-border-color`	Rahmenfarbe der Schaltfläche „In Maps öffnen“.
`--gmp-button-border-radius`	Rahmenradius des Buttons „In Maps öffnen“.
`--gmp-button-border-width`	Rahmenbreite der Schaltfläche „In Maps öffnen“.
`--gmp-collage-border-radius-outer`	Rahmenradius der äußeren Ecken der Mediencollage.
`--gmp-dialog-border-radius`	Rahmenradius des Offenlegungsdialogs von Google Maps.
`--gmp-mat-color-disabled-surface`	Oberflächenfarbe, die deaktivierte Zustände oder Nichtvorhandensein vermitteln soll. Wird für leere Rezensionssterne verwendet.
`--gmp-mat-color-info`	Farbe von UI-Elementen mit informativer Bedeutung. Wird für das Rollstuhlsymbol verwendet.
`--gmp-mat-color-negative`	Farbe von UI-Elementen mit negativer Stimmung. Wird für den Text „Geschlossen“ im Status „Jetzt geöffnet“ verwendet.
`--gmp-mat-color-neutral-container`	Containerfarbe für neutrale gefüllte UI-Elemente. Wird für Bildplatzhalter und das Badge für das Veröffentlichungsdatum der Rezension verwendet.
`--gmp-mat-color-on-neutral-container`	Farbe von Text und Symbolen im Vergleich zur neutralen Containerfarbe. Wird für das Badge mit dem Veröffentlichungsdatum der Rezension und das Badge für die Verfügbarkeit von Ladestationen für Elektrofahrzeuge verwendet, wenn diese nicht verfügbar sind.
`--gmp-mat-color-on-positive-container`	Farbe von Texten und Symbolen vor der positiven Containerfarbe. Wird für das Badge zur Verfügbarkeit von Ladestationen für Elektrofahrzeuge verwendet, sofern verfügbar.
`--gmp-mat-color-on-secondary-container`	Farbe von Text und Symbolen im Vergleich zur Farbe des sekundären Containers. Wird für Text und Symbole auf der Schaltfläche „In Maps öffnen“ verwendet.
`--gmp-mat-color-on-surface`	Farbe für Text und Symbole vor einer beliebigen Oberflächenfarbe. Wird für normalen Text verwendet.
`--gmp-mat-color-on-surface-variant`	Farbe mit geringerer Betonung für Text und Symbole vor einer beliebigen Oberflächenfarbe. Wird für weniger hervorgehobenen Text verwendet.
`--gmp-mat-color-outline-decorative`	Konturfarbe nicht interaktiver Elemente. Wird für den Rahmen des Elements verwendet.
`--gmp-mat-color-positive`	Farbe von UI-Elementen mit positiver Stimmung. Wird für den Text „Geöffnet“ im Status „Jetzt geöffnet“ verwendet.
`--gmp-mat-color-positive-container`	Containerfarbe für UI-Elemente, die eine positive Stimmung vermitteln. Wird für das Badge zur Verfügbarkeit von Ladestationen für Elektrofahrzeuge verwendet, sofern verfügbar.
`--gmp-mat-color-primary`	Farbe von interaktivem Text und Symbolen im Vergleich zur Oberflächenfarbe. Wird für die Anzahl der Rezensionen, Links im Dialogfeld für Offenlegungen in Google Maps, Website-Links, Symbole auf dem Tab „Übersicht“ und (beim Bewegen des Mauszeigers/Fokus/Textfarbe) für Titel in der Tableiste verwendet.
`--gmp-mat-color-secondary-container`	Weniger auffällige Füllfarbe im Vergleich zur Oberfläche, für zurückhaltende Komponenten wie tonale Schaltflächen. Wird für den Hintergrund der Schaltfläche „In Maps öffnen“ verwendet.
`--gmp-mat-color-surface`	Farbe für Hintergründe. Wird für den Hintergrund des Elements und des Dialogfelds mit den Google Maps-Offenlegungen verwendet.
`--gmp-mat-font-body-medium`	Wird für die Adresse, die Bewertung, den Typ, den Preis, den Status „Jetzt geöffnet“, die Öffnungszeiten, die Rezension, die Telefonnummer, die Website, den Plus Code, die wichtigsten Funktionen und den Text im Dialogfeld für die Offenlegung von Google Maps verwendet.
`--gmp-mat-font-body-small`	Wird für den Text in der Funktionsliste auf dem Tab „Info“ verwendet.
`--gmp-mat-font-display-small`	Wird für den Ortsnamen und den Text für jede Überschrift auf dem Tab „Info“ verwendet.
`--gmp-mat-font-family`	Basisschriftfamilie, die für den gesamten Text verwendet wird.
`--gmp-mat-font-headline-medium`	Wird für den Überschriftentext im Dialogfeld für die Offenlegung von Google Maps verwendet.
`--gmp-mat-font-label-large`	Wird für die Tabtitel, die Schaltfläche „In Maps öffnen“, den Text der Quellenangabe für Rezensenten in der Fotogalerie, den Text der Quellenangabe für Rezensenten im Bereich „Rezensionen“ und Links im Dialogfeld für Google Maps-Offenlegungen verwendet.
`--gmp-mat-font-label-medium`	Wird für das Badge für die Anzahl der Fotos und das Badge für das Veröffentlichungsdatum der Rezension verwendet.
`--gmp-mat-font-title-small`	Wird für den Titel der einzelnen Abschnitte auf dem Tab „Info“ verwendet.
`--gmp-mat-spacing-extra-large`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-extra-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-large`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-medium`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-two-extra-large`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-star-rating-color`	Farbe der ausgefüllten Sterne in der Bewertung.
`background-color`	Überschreibt die Hintergrundfarbe des Elements.
`border`	Überschreibt den Rahmen des Elements.
`border-radius`	Überschreibt den Rahmenradius des Elements.
`color-scheme`	Gibt an, in welchem Farbschema dieses Element gerendert werden kann. Weitere Informationen finden Sie in der `color-scheme`-Dokumentation. Die Standardeinstellung ist `color-scheme: light dark`.
`font-size`	Skaliert den gesamten Text und alle Symbole im Element, die intern in ems definiert sind. Die Standardeinstellung ist `16px`.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
`gmp-error`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn eine Anfrage an das Backend abgelehnt wurde (z.B. falscher API-Schlüssel). Dieses Ereignis wird nicht weitergegeben.
`gmp-load`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn das Element geladen wird und seinen Inhalt rendert. Dieses Ereignis wird nicht weitergegeben.

Schnittstelle PlaceDetailsElementOptions

Schnittstelle google.maps.places.PlaceDetailsElementOptions
erweitert durch AdvancedPlaceDetailsElementOptions
implementiert durch AdvancedPlaceDetailsElement, PlaceDetailsElement

Optionen für PlaceDetailsElement.

Attribute
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden.

Klasse PlaceDetailsCompactElement

Klasse google.maps.places.PlaceDetailsCompactElement erweitert HTMLElement implementiert PlaceDetailsCompactElementOptions
erweitert durch AdvancedPlaceDetailsCompactElement
Bibliothek "places"

Zeigt Details zu einem Ort in einem kompakten Layout an. Hängen Sie PlaceDetailsPlaceRequestElement oder PlaceDetailsLocationRequestElement an, um den Ort anzugeben, der gerendert werden soll. Hängen Sie PlaceContentConfigElement, PlaceStandardContentElement oder PlaceAllContentElement an, um anzugeben, welche Inhalte gerendert werden sollen.

Beispiel:

 <gmp-place-details-compact>
   <gmp-place-details-place-request
     place="PLACE_ID"
   ></gmp-place-details-place-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-details-compact>

Wenn Sie dieses Element verwenden möchten, müssen Sie die Places UI Kit API für Ihr Projekt in der Google Cloud Console aktivieren.

<gmp-place-details-compact
  internal-usage-attribution-ids="space separated strings"
  orientation="value-name"
  truncation-preferred>
</gmp-place-details-compact>

const {PlaceDetailsCompactElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceDetailsCompactElement`	`PlaceDetailsCompactElement([options])` Parameter: `options: PlaceDetailsCompactElementOptions optional`

Attribute
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`orientation` attr: orientation	Typ: `PlaceDetailsOrientation optional` Standard: `PlaceDetailsOrientation.VERTICAL` Die Ausrichtungsvariante (vertikal oder horizontal) des Elements. HTML-Attribut: `orientation="value-name"`
`place` readonly	Typ: `Place optional` Schreibgeschützt. Place-Objekt mit der ID, dem Standort und dem Darstellungsbereich des aktuell gerenderten Orts.
`truncationPreferred` attr: truncation-preferred	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Standard: `false` Wenn „true“, werden der Name und die Adresse des Ortes gekürzt, damit sie in eine Zeile passen, anstatt umgebrochen zu werden. HTML-Attribut: `truncation-preferred`

CSS-Eigenschaften
`--gmp-button-border-color`	Rahmenfarbe der Schaltfläche „In Maps öffnen“.
`--gmp-button-border-radius`	Rahmenradius des Buttons „In Maps öffnen“.
`--gmp-button-border-width`	Rahmenbreite der Schaltfläche „In Maps öffnen“.
`--gmp-dialog-border-radius`	Rahmenradius des Offenlegungsdialogs von Google Maps.
`--gmp-mat-color-info`	Farbe von UI-Elementen mit informativer Bedeutung. Wird für das Rollstuhlsymbol verwendet.
`--gmp-mat-color-negative`	Farbe von UI-Elementen mit negativer Stimmung. Wird für den Text „Geschlossen“ im Status „Jetzt geöffnet“ verwendet.
`--gmp-mat-color-neutral-container`	Containerfarbe für neutrale gefüllte UI-Elemente. Wird für Bildplatzhalter verwendet.
`--gmp-mat-color-on-secondary-container`	Farbe von Text und Symbolen im Vergleich zur Farbe des sekundären Containers. Wird für Text und Symbole auf der Schaltfläche „In Maps öffnen“ verwendet.
`--gmp-mat-color-on-surface`	Farbe für Text und Symbole vor einer beliebigen Oberflächenfarbe. Wird für normalen Text verwendet.
`--gmp-mat-color-on-surface-variant`	Farbe mit geringerer Betonung für Text und Symbole vor einer beliebigen Oberflächenfarbe. Wird für weniger hervorgehobenen Text verwendet.
`--gmp-mat-color-outline-decorative`	Konturfarbe nicht interaktiver Elemente. Wird für den Rahmen des Elements verwendet.
`--gmp-mat-color-positive`	Farbe von UI-Elementen mit positiver Stimmung. Wird für den Text „Geöffnet“ im Status „Jetzt geöffnet“ verwendet.
`--gmp-mat-color-primary`	Farbe von interaktivem Text und Symbolen im Vergleich zur Oberflächenfarbe. Wird für die Anzahl der Rezensionen sowie für Links im Dialogfeld für Offenlegungen in Google Maps verwendet.
`--gmp-mat-color-secondary-container`	Weniger auffällige Füllfarbe im Vergleich zur Oberfläche, für zurückhaltende Komponenten wie tonale Schaltflächen. Wird für den Hintergrund der Schaltfläche „In Maps öffnen“ verwendet.
`--gmp-mat-color-surface`	Farbe für Hintergründe. Wird für den Hintergrund des Elements und des Dialogfelds mit den Google Maps-Offenlegungen verwendet.
`--gmp-mat-font-body-medium`	Wird für den Text im Dialogfeld für die Offenlegung von Google Maps verwendet.
`--gmp-mat-font-body-small`	Wird für die Adresse, die Bewertung, den Typ, den Preis und den Status „Jetzt geöffnet“ des Ortes verwendet.
`--gmp-mat-font-family`	Basisschriftfamilie, die für den gesamten Text verwendet wird.
`--gmp-mat-font-headline-medium`	Wird für den Überschriftentext im Dialogfeld für die Offenlegung von Google Maps verwendet.
`--gmp-mat-font-label-large`	Wird für die Schaltfläche „In Maps öffnen“ sowie für Links im Dialogfeld für Google Maps-Offenlegungen und für den Text der Quellenangabe des Rezensenten in der Fotogalerie verwendet.
`--gmp-mat-font-label-medium`	Wird für das Badge mit der Anzahl der Fotos verwendet.
`--gmp-mat-font-title-small`	Wird für den Ortsnamen verwendet.
`--gmp-mat-spacing-extra-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-large`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-medium`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-star-rating-color`	Farbe der ausgefüllten Sterne in der Bewertung.
`--gmp-thumbnail-border-radius`	Rahmenradius des Miniaturbilds des Ortes.
`background-color`	Überschreibt die Hintergrundfarbe des Elements.
`border`	Überschreibt den Rahmen des Elements.
`border-radius`	Überschreibt den Rahmenradius des Elements.
`color-scheme`	Gibt an, in welchem Farbschema dieses Element gerendert werden kann. Weitere Informationen finden Sie in der `color-scheme`-Dokumentation. Die Standardeinstellung ist `color-scheme: light dark`.
`font-size`	Skaliert den gesamten Text und alle Symbole im Element, die intern in ems definiert sind. Die Standardeinstellung ist `16px`.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
`gmp-error`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn eine Anfrage an das Backend abgelehnt wurde (z.B. falscher API-Schlüssel). Dieses Ereignis wird nicht weitergegeben.
`gmp-load`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn das Element geladen wird und seinen Inhalt rendert. Dieses Ereignis wird nicht weitergegeben.

PlaceDetailsCompactElementOptions-Schnittstelle

Schnittstelle google.maps.places.PlaceDetailsCompactElementOptions
erweitert durch AdvancedPlaceDetailsCompactElementOptions
implementiert durch AdvancedPlaceDetailsCompactElement, PlaceDetailsCompactElement

Optionen für PlaceDetailsCompactElement.

Attribute
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden.
`orientation` optional	Typ: `PlaceDetailsOrientation optional` `PlaceDetailsCompactElement.orientation` ansehen.
`truncationPreferred` optional	Typ: `boolean optional` `PlaceDetailsCompactElement.truncationPreferred` ansehen.

AdvancedPlaceDetailsElement-Klasse

class google.maps.places.AdvancedPlaceDetailsElement extends PlaceDetailsElement, HTMLElement implements AdvancedPlaceDetailsElementOptions, PlaceDetailsElementOptions
library "places"

Zeigt Details zu einem Ort in einem vollständigen Layout an. Hängen Sie entweder PlaceDetailsPlaceRequestElement oder PlaceDetailsLocationRequestElement an, um den Ort anzugeben, der gerendert werden soll. Hängen Sie ein PlaceStandardContentElement-, PlaceAllContentElement- oder Place Details-Element direkt an, um den zu rendernden Inhalt zu konfigurieren.

Beispiel:

 <gmp-advanced-place-details>
   <gmp-place-details-place-request
     place="PLACE_ID"
   ></gmp-place-details-place-request>
   <gmp-place-standard-content>
   </gmp-place-standard-content>
 </gmp-advanced-place-details>

Wenn Sie dieses Element verwenden möchten, müssen Sie die Places UI Kit API für Ihr Projekt in der Google Cloud Console aktivieren.

<gmp-advanced-place-details
  internal-usage-attribution-ids="space separated strings">
</gmp-advanced-place-details>

const {AdvancedPlaceDetailsElement} = await google.maps.importLibrary("places");

Konstruktor
`AdvancedPlaceDetailsElement`	`AdvancedPlaceDetailsElement([options])` Parameter: `options: AdvancedPlaceDetailsElementOptions optional`

Attribute
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`place` readonly	Typ: `Place optional` Schreibgeschützt. Place-Objekt mit der ID, dem Standort und dem Darstellungsbereich des aktuell gerenderten Orts.

Slots
`action-corner`	Ein Slot für `PlaceLinkElement` und `PlaceButtonElement`.
`action-main`	Ein Slot für `PlaceLinkElement` und `PlaceButtonElement`.
`basic-section-bottom`	Hinweis: Nur in der v=Alphaversion verfügbar. Ein Slot für benutzerdefinierte HTML-Inhalte, die am Ende des Abschnitts mit grundlegenden Informationen direkt unter den Haupt-Aktionsbuttons gerendert werden.
`basic-section-top`	Hinweis: Nur in der v=Alphaversion verfügbar. Ein Slot für benutzerdefinierte HTML-Inhalte, die im Bereich mit grundlegenden Informationen direkt über dem Ortsnamen gerendert werden.

CSS-Eigenschaften
Übernommen: `--gmp-button-border-color`, `--gmp-button-border-radius`, `--gmp-button-border-width`, `--gmp-collage-border-radius-outer`, `--gmp-dialog-border-radius`, `--gmp-mat-color-disabled-surface`, `--gmp-mat-color-info`, `--gmp-mat-color-negative`, `--gmp-mat-color-neutral-container`, `--gmp-mat-color-on-neutral-container`, `--gmp-mat-color-on-positive-container`, `--gmp-mat-color-on-secondary-container`, `--gmp-mat-color-on-surface`, `--gmp-mat-color-on-surface-variant`, `--gmp-mat-color-outline-decorative`, `--gmp-mat-color-positive`, `--gmp-mat-color-positive-container`, `--gmp-mat-color-primary`, `--gmp-mat-color-secondary-container`, `--gmp-mat-color-surface`, `--gmp-mat-font-body-medium`, `--gmp-mat-font-body-small`, `--gmp-mat-font-display-small`, `--gmp-mat-font-family`, `--gmp-mat-font-headline-medium`, `--gmp-mat-font-label-large`, `--gmp-mat-font-label-medium`, `--gmp-mat-font-title-small`, `--gmp-mat-spacing-extra-large`, `--gmp-mat-spacing-extra-small`, `--gmp-mat-spacing-large`, `--gmp-mat-spacing-medium`, `--gmp-mat-spacing-small`, `--gmp-mat-spacing-two-extra-large`, `--gmp-star-rating-color`, `background-color`, `border`, `border-radius`, `color-scheme`, `font-size`

CSS-Eigenschaften

Übernommen: --gmp-button-border-color, --gmp-button-border-radius, --gmp-button-border-width, --gmp-collage-border-radius-outer, --gmp-dialog-border-radius, --gmp-mat-color-disabled-surface, --gmp-mat-color-info, --gmp-mat-color-negative, --gmp-mat-color-neutral-container, --gmp-mat-color-on-neutral-container, --gmp-mat-color-on-positive-container, --gmp-mat-color-on-secondary-container, --gmp-mat-color-on-surface, --gmp-mat-color-on-surface-variant, --gmp-mat-color-outline-decorative, --gmp-mat-color-positive, --gmp-mat-color-positive-container, --gmp-mat-color-primary, --gmp-mat-color-secondary-container, --gmp-mat-color-surface, --gmp-mat-font-body-medium, --gmp-mat-font-body-small, --gmp-mat-font-display-small, --gmp-mat-font-family, --gmp-mat-font-headline-medium, --gmp-mat-font-label-large, --gmp-mat-font-label-medium, --gmp-mat-font-title-small, --gmp-mat-spacing-extra-large, --gmp-mat-spacing-extra-small, --gmp-mat-spacing-large, --gmp-mat-spacing-medium, --gmp-mat-spacing-small, --gmp-mat-spacing-two-extra-large, --gmp-star-rating-color, background-color, border, border-radius, color-scheme, font-size

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
Übernommen: `gmp-error`, `gmp-load`

AdvancedPlaceDetailsElementOptions-Schnittstelle

Schnittstelle google.maps.places.AdvancedPlaceDetailsElementOptions erweitert PlaceDetailsElementOptions
implementiert von AdvancedPlaceDetailsElement

Optionen für AdvancedPlaceDetailsElement.

Attribute
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden.

AdvancedPlaceDetailsCompactElement-Klasse

class google.maps.places.AdvancedPlaceDetailsCompactElement extends PlaceDetailsCompactElement, HTMLElement implements AdvancedPlaceDetailsCompactElementOptions, PlaceDetailsCompactElementOptions
library "places"

Zeigt Details zu einem Ort in einem kompakten Layout an. Hängen Sie PlaceDetailsPlaceRequestElement oder PlaceDetailsLocationRequestElement an, um den Ort anzugeben, der gerendert werden soll. Hängen Sie ein PlaceStandardContentElement oder PlaceAllContentElement an oder geben Sie bestimmte untergeordnete Inhalte an, um den zu rendernden Inhalt zu konfigurieren.

Wenn Sie dieses Element verwenden möchten, müssen Sie die Places UI Kit API für Ihr Projekt in der Google Cloud Console aktivieren.

<gmp-advanced-place-details-compact
  internal-usage-attribution-ids="space separated strings">
</gmp-advanced-place-details-compact>

const {AdvancedPlaceDetailsCompactElement} = await google.maps.importLibrary("places");

Konstruktor
`AdvancedPlaceDetailsCompactElement`	`AdvancedPlaceDetailsCompactElement([options])` Parameter: `options: AdvancedPlaceDetailsCompactElementOptions optional`

Attribute
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`place` readonly	Typ: `Place optional` Schreibgeschützt. Place-Objekt mit der ID, dem Standort und dem Darstellungsbereich des aktuell gerenderten Orts.
Übernommen: `orientation` (attr: `orientation`), `truncationPreferred` (attr: `truncation-preferred`)

Slots
`action-corner`	Ein Slot für `PlaceLinkElement` und `PlaceButtonElement`.
`action-main`	Ein Slot für `PlaceLinkElement` und `PlaceButtonElement`.
`basic-section-bottom`	Hinweis: Nur in der v=Alphaversion verfügbar. Ein Slot für benutzerdefinierte HTML-Inhalte, die am Ende des Abschnitts mit grundlegenden Informationen direkt unter den Haupt-Aktionsbuttons gerendert werden.
`basic-section-top`	Hinweis: Nur in der v=Alphaversion verfügbar. Ein Slot für benutzerdefinierte HTML-Inhalte, die im Bereich mit grundlegenden Informationen direkt über dem Ortsnamen gerendert werden.

CSS-Eigenschaften
Übernommen: `--gmp-button-border-color`, `--gmp-button-border-radius`, `--gmp-button-border-width`, `--gmp-dialog-border-radius`, `--gmp-mat-color-info`, `--gmp-mat-color-negative`, `--gmp-mat-color-neutral-container`, `--gmp-mat-color-on-secondary-container`, `--gmp-mat-color-on-surface`, `--gmp-mat-color-on-surface-variant`, `--gmp-mat-color-outline-decorative`, `--gmp-mat-color-positive`, `--gmp-mat-color-primary`, `--gmp-mat-color-secondary-container`, `--gmp-mat-color-surface`, `--gmp-mat-font-body-medium`, `--gmp-mat-font-body-small`, `--gmp-mat-font-family`, `--gmp-mat-font-headline-medium`, `--gmp-mat-font-label-large`, `--gmp-mat-font-label-medium`, `--gmp-mat-font-title-small`, `--gmp-mat-spacing-extra-small`, `--gmp-mat-spacing-large`, `--gmp-mat-spacing-medium`, `--gmp-mat-spacing-small`, `--gmp-star-rating-color`, `--gmp-thumbnail-border-radius`, `background-color`, `border`, `border-radius`, `color-scheme`, `font-size`

CSS-Eigenschaften

Übernommen: --gmp-button-border-color, --gmp-button-border-radius, --gmp-button-border-width, --gmp-dialog-border-radius, --gmp-mat-color-info, --gmp-mat-color-negative, --gmp-mat-color-neutral-container, --gmp-mat-color-on-secondary-container, --gmp-mat-color-on-surface, --gmp-mat-color-on-surface-variant, --gmp-mat-color-outline-decorative, --gmp-mat-color-positive, --gmp-mat-color-primary, --gmp-mat-color-secondary-container, --gmp-mat-color-surface, --gmp-mat-font-body-medium, --gmp-mat-font-body-small, --gmp-mat-font-family, --gmp-mat-font-headline-medium, --gmp-mat-font-label-large, --gmp-mat-font-label-medium, --gmp-mat-font-title-small, --gmp-mat-spacing-extra-small, --gmp-mat-spacing-large, --gmp-mat-spacing-medium, --gmp-mat-spacing-small, --gmp-star-rating-color, --gmp-thumbnail-border-radius, background-color, border, border-radius, color-scheme, font-size

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
Übernommen: `gmp-error`, `gmp-load`

AdvancedPlaceDetailsCompactElementOptions-Schnittstelle

Schnittstelle google.maps.places.AdvancedPlaceDetailsCompactElementOptions erweitert PlaceDetailsCompactElementOptions
implementiert von AdvancedPlaceDetailsCompactElement

Optionen für AdvancedPlaceDetailsCompactElement.

Attribute
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden.
Übernommen: `orientation`, `truncationPreferred`

PlaceDetailsOrientation-Konstanten

Konstanten google.maps.places.PlaceDetailsOrientation
Bibliothek "places"

Ausrichtungsvarianten für PlaceDetailsCompactElement.

Diese Konstanten können auch als Strings verwendet werden. In TypeScript werden die Stringliterale durch den Typ PlaceDetailsOrientationString definiert.

const {PlaceDetailsOrientation} = await google.maps.importLibrary("places");

Konstanten
`HORIZONTAL`	Horizontale Ausrichtung.
`VERTICAL`	Vertikale Ausrichtung.

PlaceDetailsPlaceRequestElement-Klasse

class google.maps.places.PlaceDetailsPlaceRequestElement extends HTMLElement implements PlaceDetailsPlaceRequestElementOptions
library "places"

Konfiguriert ein PlaceDetailsCompactElement- oder PlaceDetailsElement-Objekt, um Daten basierend auf einem Ortsobjekt, einer ID oder einem Ressourcennamen zu laden. Hängen Sie dieses Element als untergeordnetes Element von PlaceDetailsCompactElement oder PlaceDetailsElement an, um Daten für den angegebenen Ort zu laden. Beispiel:

 <gmp-place-details>
   <gmp-place-details-place-request
     place="PLACE_ID"
   ></gmp-place-details-place-request>
 </gmp-place-details>

<gmp-place-details-place-request
  place="places/###">
</gmp-place-details-place-request>

const {PlaceDetailsPlaceRequestElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceDetailsPlaceRequestElement`	`PlaceDetailsPlaceRequestElement([options])` Parameter: `options: PlaceDetailsPlaceRequestElementOptions optional`

Attribute
`place` attr: place	Eingabetyp: `Place\|string optional` Ausgabetyp: `Place optional` Standard: `null` Das Ortsobjekt, die ID oder der Ressourcenname, für den Details im kompakten Element „Place Details“ gerendert werden sollen. Diese Property wird als Ressourcenname auf das Attribut übertragen. HTML-Attribut: `place="places/###"`

Methoden
Übernommen: `addEventListener`, `removeEventListener`

PlaceDetailsPlaceRequestElementOptions-Schnittstelle

Schnittstelle google.maps.places.PlaceDetailsPlaceRequestElementOptions
implementiert von PlaceDetailsPlaceRequestElement

Optionen für PlaceDetailsPlaceRequestElement.

Attribute
`place` optional	Typ: `Place\|string optional` `PlaceDetailsPlaceRequestElement.place` ansehen

PlaceDetailsLocationRequestElement-Klasse

class google.maps.places.PlaceDetailsLocationRequestElement extends HTMLElement implements PlaceDetailsLocationRequestElementOptions
library "places"

Konfiguriert einen PlaceDetailsCompactElement oder PlaceDetailsElement, um Daten basierend auf einem Standort zu laden. Hängen Sie dieses Element als untergeordnetes Element von PlaceDetailsCompactElement oder PlaceDetailsElement an, um Daten für den angegebenen Standort zu laden. Beispiel:

 <gmp-place-details>
   <gmp-place-details-location-request
     location="37.6207665,-122.4284806"
   ></gmp-place-details-location-request>
 </gmp-place-details>

<gmp-place-details-location-request
  location="lat,lng">
</gmp-place-details-location-request>

const {PlaceDetailsLocationRequestElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceDetailsLocationRequestElement`	`PlaceDetailsLocationRequestElement([options])` Parameter: `options: PlaceDetailsLocationRequestElementOptions optional`

Attribute
`location` attr: location	Eingabetyp: `LatLng\|LatLngLiteral\|LatLngAltitude\|LatLngAltitudeLiteral optional` Ausgabetyp: `LatLngAltitude optional` Standard: `null` Der Ort, für den Details im Place Details-Element gerendert werden sollen. Normalisiert in ein `LatLngAltitude`-Format. HTML-Attribut: `location="lat,lng"`

Methoden
Übernommen: `addEventListener`, `removeEventListener`

PlaceDetailsLocationRequestElementOptions-Schnittstelle

Schnittstelle google.maps.places.PlaceDetailsLocationRequestElementOptions
implementiert von PlaceDetailsLocationRequestElement

Optionen für PlaceDetailsLocationRequestElement.

Attribute
`location` optional	Typ: `LatLng\|LatLngLiteral\|LatLngAltitude\|LatLngAltitudeLiteral optional` Der Ort, für den der Ort gerendert werden soll.

Klasse PlaceSearchElement

Klasse google.maps.places.PlaceSearchElement erweitert HTMLElement implementiert PlaceSearchElementOptions
erweitert durch AdvancedPlaceSearchElement
Bibliothek "places"

Zeigt die Ergebnisse einer Ortssuche in einer Liste an. Hängen Sie PlaceTextSearchRequestElement oder PlaceNearbySearchRequestElement an, um die Anfrage anzugeben, für die Ergebnisse gerendert werden sollen. Hängen Sie PlaceContentConfigElement, PlaceStandardContentElement oder PlaceAllContentElement an, um anzugeben, welche Inhalte gerendert werden sollen.

Beispiel:

 <gmp-place-search>
   <gmp-place-text-search-request
     text-query="QUERY"
   ></gmp-place-text-search-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-search>

Wenn Sie das Element „Place Search“ verwenden möchten, müssen Sie die Places UI Kit API für Ihr Projekt in der Google Cloud Console aktivieren.

<gmp-place-search
  attribution-position="value-name"
  internal-usage-attribution-ids="space separated strings"
  orientation="value-name"
  selectable
  truncation-preferred>
</gmp-place-search>

const {PlaceSearchElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceSearchElement`	`PlaceSearchElement([options])` Parameter: `options: PlaceSearchElementOptions optional`

Attribute
`attributionPosition` attr: attribution-position	Eingabetyp: `PlaceSearchAttributionPosition optional` Ausgabetyp: `PlaceSearchAttributionPosition` Standard: `PlaceSearchAttributionPosition.TOP` Die Position des Attributionslogos und der Schaltfläche für rechtliche Hinweise. HTML-Attribut: `attribution-position="value-name"`
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`orientation` attr: orientation	Eingabetyp: `PlaceSearchOrientation optional` Ausgabetyp: `PlaceSearchOrientation` Standard: `PlaceSearchOrientation.VERTICAL` Die Ausrichtungsvariante (vertikal oder horizontal) des Elements. HTML-Attribut: `orientation="value-name"`
`places` readonly	Typ: `Array<Place>` Schreibgeschützt. Array von `Place`-Objekten, die die IDs, Standorte und Darstellungsbereiche der aktuell gerenderten Orte enthalten.
`selectable` attr: selectable	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Standard: `false` Gibt an, ob die Listenelemente auswählbar sind. Wenn „true“, sind die Listenelemente Schaltflächen, die beim Klicken das Ereignis `gmp-select` auslösen. Die barrierefreie Tastaturnavigation und -auswahl wird ebenfalls unterstützt. HTML-Attribut: `selectable`
`truncationPreferred` attr: truncation-preferred	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Standard: `false` Wenn „true“, werden bestimmte Inhaltszeilen gekürzt, damit sie in eine Zeile passen, anstatt umgebrochen zu werden. HTML-Attribut: `truncation-preferred`

CSS-Eigenschaften
`--gmp-button-border-color`	Rahmenfarbe für den Button „In Maps öffnen“.
`--gmp-button-border-radius`	Rahmenradius für die Schaltfläche „In Maps öffnen“.
`--gmp-button-border-width`	Rahmenbreite für die Schaltfläche „In Maps öffnen“.
`--gmp-card-border-radius`	Rahmenradius für Ortskarten.
`--gmp-dialog-border-radius`	Rahmenradius für das Dialogfeld zur Offenlegung von Google Maps.
`--gmp-mat-color-info`	Farbe von UI-Elementen mit informativer Bedeutung. Wird für das Symbol für barrierefreie Eingänge verwendet.
`--gmp-mat-color-negative`	Farbe von UI-Elementen mit negativer Stimmung. Wird für das Label „Geschlossen“ für die Öffnungszeiten eines Orts verwendet.
`--gmp-mat-color-neutral-container`	Containerfarbe für neutrale gefüllte UI-Elemente. Wird für Badges mit dem Datum der Rezension und zum Laden von Platzhalterformen verwendet.
`--gmp-mat-color-on-neutral-container`	Farbe von Text und Symbolen in einem neutralen Container. Wird für den Text des Überprüfungsdatums und den Text des Ladefehlers verwendet.
`--gmp-mat-color-on-secondary-container`	Farbe von Text und Symbolen vor einer sekundären Containerfarbe. Wird für Buttontext und Symbole verwendet.
`--gmp-mat-color-on-surface`	Farbe für Text und Symbole vor einer Oberflächenfarbe. Wird für Überschriften und Dialoginhalte verwendet.
`--gmp-mat-color-on-surface-variant`	Farbe mit geringerer Betonung für Text und Symbole vor einer Oberflächenfarbe. Wird für Ortsinformationen verwendet.
`--gmp-mat-color-outline-decorative`	Konturfarbe nicht interaktiver Elemente. Wird für den Containerrahmen verwendet.
`--gmp-mat-color-positive`	Farbe von UI-Elementen mit positiver Stimmung. Wird für das Label „Geöffnet“ für die Öffnungszeiten eines Ortes verwendet.
`--gmp-mat-color-primary`	Farbe von interaktivem Text und Symbolen im Vergleich zur Oberflächenfarbe. Wird für Links, die Fortschrittsanzeige und Übersichtssymbole verwendet.
`--gmp-mat-color-secondary-container`	Weniger auffällige Füllfarbe auf einer Oberfläche. Wird für Schaltflächenhintergründe verwendet.
`--gmp-mat-color-surface`	Farbe für Hintergründe. Wird für Container- und Dialoghintergründe verwendet.
`--gmp-mat-font-body-small`	Wird für Ortsinformationen verwendet.
`--gmp-mat-font-family`	Basisschriftfamilie für den gesamten Text.
`--gmp-mat-font-headline-medium`	Wird für Dialogüberschriften verwendet.
`--gmp-mat-font-label-large`	Wird für Schaltflächeninhalte verwendet.
`--gmp-mat-font-title-medium`	Wird für den Ortsnamen verwendet.
`--gmp-mat-spacing-extra-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-large`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-medium`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-star-rating-color`	Farbe der ausgefüllten Sterne in einer Sternebewertung.
`--gmp-thumbnail-border-radius`	Rahmenradius für die Miniaturansicht des Ortes.
`background-color`	Überschreibt die Hintergrundfarbe des Elements.
`border`	Überschreibt den Rahmen des Elements.
`border-radius`	Überschreibt den Rahmenradius des Elements.
`color-scheme`	Gibt an, in welchem Farbschema dieses Element gerendert werden kann. Weitere Informationen finden Sie in der `color-scheme`-Dokumentation. Die Standardeinstellung ist `color-scheme: light dark`.
`font-size`	Skaliert den gesamten Text und alle Symbole im Element. Die Standardeinstellung ist `16px`.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
`gmp-error`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn eine Anfrage an das Backend abgelehnt wurde (z.B. falscher API-Schlüssel). Dieses Ereignis wird nicht weitergegeben.
`gmp-load`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn das Element geladen wird und seinen Inhalt rendert. Dieses Ereignis wird nicht weitergegeben.
`gmp-select`	`function(event)` Argumente: `event: PlaceSelectEvent optional` Dieses Ereignis wird ausgelöst, wenn ein Ort aus der Liste ausgewählt wird. Enthält ein `Place`-Objekt mit der ID, dem Standort und dem Darstellungsbereich des ausgewählten Orts.

Schnittstelle PlaceSearchElementOptions

Schnittstelle google.maps.places.PlaceSearchElementOptions
erweitert durch AdvancedPlaceSearchElementOptions
implementiert durch AdvancedPlaceSearchElement, PlaceSearchElement

Optionen für PlaceSearchElement.

Attribute
`attributionPosition` optional	Typ: `PlaceSearchAttributionPosition optional` `PlaceSearchElement.attributionPosition` ansehen.
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden.
`orientation` optional	Typ: `PlaceSearchOrientation optional` `PlaceSearchElement.orientation` ansehen.
`selectable` optional	Typ: `boolean optional` `PlaceSearchElement.selectable` ansehen
`truncationPreferred` optional	Typ: `boolean optional` `PlaceSearchElement.truncationPreferred` ansehen.

PlaceItemElement-Klasse

Klasse google.maps.places.PlaceItemElement erweitert HTMLElement implementiert PlaceItemElementOptions
erweitert durch AdvancedPlaceItemElement
Bibliothek "places"

Öffentlicher Webkomponenten-Wrapper (<gmp-place-item>) für Elemente in Ortslisten. Mit dem benutzerdefinierten Element <gmp-place-item> wird eine einzelne Karte mit einem Ortsergebnis in <gmp-place-search> gerendert. In jedem <gmp-place-item> werden Ortsinformationen angezeigt, die aus untergeordneten visuellen Komponenten des Places UI Kit bestehen.

<gmp-place-item></gmp-place-item>

const {PlaceItemElement} = await google.maps.importLibrary("places");

Methoden
Übernommen: `addEventListener`, `removeEventListener`

PlaceItemElementOptions-Schnittstelle

Schnittstelle google.maps.places.PlaceItemElementOptions
erweitert durch AdvancedPlaceItemElementOptions
implementiert durch AdvancedPlaceItemElement, PlaceItemElement

Optionen für PlaceItemElement.

AdvancedPlaceSearchElement-Klasse

class google.maps.places.AdvancedPlaceSearchElement extends PlaceSearchElement, HTMLElement implements AdvancedPlaceSearchElementOptions, PlaceSearchElementOptions
library "places"

Zeigt die Ergebnisse einer erweiterten Ortssuche in einer Liste an. Hängen Sie PlaceTextSearchRequestElement oder PlaceNearbySearchRequestElement an, um die Anfrage anzugeben, für die Ergebnisse gerendert werden sollen. Hängen Sie PlaceStandardContentElement, PlaceAllContentElement oder <template slot="details-item"> an, um anzugeben, welche Inhalte gerendert werden sollen.

Beispiel:

 <gmp-advanced-place-search>
   <gmp-place-text-search-request
     text-query="QUERY"
   ></gmp-place-text-search-request>
   <template slot="details-item">
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </template>
 </gmp-advanced-place-search>

Wenn Sie das Element „Erweiterte Ortssuche“ verwenden möchten, müssen Sie die Places UI Kit API für Ihr Projekt in der Google Cloud Console aktivieren.

<gmp-advanced-place-search
  attribution-position="value-name"
  internal-usage-attribution-ids="space separated strings"
  orientation="value-name"
  selectable
  truncation-preferred>
</gmp-advanced-place-search>

const {AdvancedPlaceSearchElement} = await google.maps.importLibrary("places");

Konstruktor
`AdvancedPlaceSearchElement`	`AdvancedPlaceSearchElement([options])` Parameter: `options: AdvancedPlaceSearchElementOptions optional`

Attribute
`attributionPosition` attr: attribution-position	Eingabetyp: `PlaceSearchAttributionPosition optional` Ausgabetyp: `PlaceSearchAttributionPosition` Standard: `PlaceSearchAttributionPosition.TOP` Die Position des Attributionslogos und der Schaltfläche für rechtliche Hinweise. HTML-Attribut: `attribution-position="value-name"`
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`orientation` attr: orientation	Eingabetyp: `PlaceSearchOrientation optional` Ausgabetyp: `PlaceSearchOrientation` Standard: `PlaceSearchOrientation.VERTICAL` Die Ausrichtungsvariante (vertikal oder horizontal) des Elements. HTML-Attribut: `orientation="value-name"`
`selectable` attr: selectable	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Standard: `false` Gibt an, ob die Listenelemente auswählbar sind. Wenn „true“, sind die Listenelemente Schaltflächen, die beim Klicken das Ereignis `gmp-select` auslösen. Die barrierefreie Tastaturnavigation und -auswahl wird ebenfalls unterstützt. HTML-Attribut: `selectable`
`truncationPreferred` attr: truncation-preferred	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Standard: `false` Wenn „true“, werden bestimmte Inhaltszeilen gekürzt, damit sie in eine Zeile passen, anstatt umgebrochen zu werden. HTML-Attribut: `truncation-preferred`
Übernommen: `places`

Slots
`details-item`	Die HTML-Vorlage, die gmp-place-Widgets enthält, die für jeden Ort in den Suchergebnissen gerendert werden sollen.

CSS-Eigenschaften
`--gmp-button-border-color`	Rahmenfarbe für den Button „In Maps öffnen“.
`--gmp-button-border-radius`	Rahmenradius für die Schaltfläche „In Maps öffnen“.
`--gmp-button-border-width`	Rahmenbreite für die Schaltfläche „In Maps öffnen“.
`--gmp-card-border-radius`	Rahmenradius für Ortskarten.
`--gmp-dialog-border-radius`	Rahmenradius für das Dialogfeld zur Offenlegung von Google Maps.
`--gmp-mat-color-info`	Farbe von UI-Elementen mit informativer Bedeutung. Wird für das Symbol für barrierefreie Eingänge verwendet.
`--gmp-mat-color-negative`	Farbe von UI-Elementen mit negativer Stimmung. Wird für das Label „Geschlossen“ für die Öffnungszeiten eines Orts verwendet.
`--gmp-mat-color-neutral-container`	Containerfarbe für neutrale gefüllte UI-Elemente. Wird für Badges mit dem Datum der Rezension und zum Laden von Platzhalterformen verwendet.
`--gmp-mat-color-on-neutral-container`	Farbe von Text und Symbolen in einem neutralen Container. Wird für den Text des Überprüfungsdatums und den Text des Ladefehlers verwendet.
`--gmp-mat-color-on-secondary-container`	Farbe von Text und Symbolen vor einer sekundären Containerfarbe. Wird für Buttontext und Symbole verwendet.
`--gmp-mat-color-on-surface`	Farbe für Text und Symbole vor einer Oberflächenfarbe. Wird für Überschriften und Dialoginhalte verwendet.
`--gmp-mat-color-on-surface-variant`	Farbe mit geringerer Betonung für Text und Symbole vor einer Oberflächenfarbe. Wird für Ortsinformationen verwendet.
`--gmp-mat-color-outline-decorative`	Konturfarbe nicht interaktiver Elemente. Wird für den Containerrahmen verwendet.
`--gmp-mat-color-positive`	Farbe von UI-Elementen mit positiver Stimmung. Wird für das Label „Geöffnet“ für die Öffnungszeiten eines Ortes verwendet.
`--gmp-mat-color-primary`	Farbe von interaktivem Text und Symbolen im Vergleich zur Oberflächenfarbe. Wird für Links, die Fortschrittsanzeige und Übersichtssymbole verwendet.
`--gmp-mat-color-secondary-container`	Weniger auffällige Füllfarbe auf einer Oberfläche. Wird für Schaltflächenhintergründe verwendet.
`--gmp-mat-color-surface`	Farbe für Hintergründe. Wird für Container- und Dialoghintergründe verwendet.
`--gmp-mat-font-body-small`	Wird für Ortsinformationen verwendet.
`--gmp-mat-font-family`	Basisschriftfamilie für den gesamten Text.
`--gmp-mat-font-headline-medium`	Wird für Dialogüberschriften verwendet.
`--gmp-mat-font-label-large`	Wird für Schaltflächeninhalte verwendet.
`--gmp-mat-font-title-medium`	Wird für den Ortsnamen verwendet.
`--gmp-mat-spacing-extra-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-large`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-medium`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-star-rating-color`	Farbe der ausgefüllten Sterne in einer Sternebewertung.
`--gmp-thumbnail-border-radius`	Rahmenradius für die Miniaturansicht des Ortes.
`background-color`	Überschreibt die Hintergrundfarbe des Elements.
`border`	Überschreibt den Rahmen des Elements.
`border-radius`	Überschreibt den Rahmenradius des Elements.
`color-scheme`	Gibt an, in welchem Farbschema dieses Element gerendert werden kann. Weitere Informationen finden Sie in der `color-scheme`-Dokumentation. Die Standardeinstellung ist `color-scheme: light dark`.
`font-size`	Skaliert den gesamten Text und alle Symbole im Element. Die Standardeinstellung ist `16px`.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
`gmp-error`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn eine Anfrage an das Backend abgelehnt wurde (z.B. falscher API-Schlüssel). Dieses Ereignis wird nicht weitergegeben.
`gmp-load`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn das Element geladen wird und seinen Inhalt rendert. Dieses Ereignis wird nicht weitergegeben.
`gmp-select`	`function(event)` Argumente: `event: PlaceSelectEvent optional` Dieses Ereignis wird ausgelöst, wenn ein Ort aus der Liste ausgewählt wird. Enthält ein `Place`-Objekt mit der ID, dem Standort und dem Darstellungsbereich des ausgewählten Orts.

AdvancedPlaceSearchElementOptions-Schnittstelle

Schnittstelle google.maps.places.AdvancedPlaceSearchElementOptions erweitert PlaceSearchElementOptions
implementiert von AdvancedPlaceSearchElement

Optionen für AdvancedPlaceSearchElement.

Attribute
`attributionPosition` optional	Typ: `PlaceSearchAttributionPosition optional` `PlaceSearchElement.attributionPosition` ansehen.
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden.
`orientation` optional	Typ: `PlaceSearchOrientation optional` `PlaceSearchElement.orientation` ansehen.
`selectable` optional	Typ: `boolean optional` `PlaceSearchElement.selectable` ansehen
`truncationPreferred` optional	Typ: `boolean optional` `PlaceSearchElement.truncationPreferred` ansehen.

AdvancedPlaceListElement-Klasse

class google.maps.places.AdvancedPlaceListElement extends HTMLElement implements AdvancedPlaceListElementOptions
library "places"

Zeigt die Ergebnisse einer Ortssuche in einer Liste an. Hängen Sie einen oder mehrere PlaceDetailsPlaceRequestElement-Werte an oder legen Sie die Property places fest, um die anzuzeigenden Orte anzugeben. Hängen Sie PlaceStandardContentElement oder PlaceAllContentElement an, um anzugeben, welche Inhalte gerendert werden sollen.

Beispiel:

 <gmp-advanced-place-list>
   <gmp-place-details-place-request
     place="PLACE_ID"
   </gmp-place-details-place-request>
   <template slot="details-item">
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </template>
 </gmp-advanced-place-list>

Wenn Sie das erweiterte Element für Ortslisten verwenden möchten, müssen Sie die Places UI Kit API für Ihr Projekt in der Google Cloud Console aktivieren.

<gmp-advanced-place-list
  attribution-position="value-name"
  internal-usage-attribution-ids="space separated strings"
  orientation="value-name"
  places="space separated strings"
  selectable
  truncation-preferred>
</gmp-advanced-place-list>

const {AdvancedPlaceListElement} = await google.maps.importLibrary("places");

Konstruktor
`AdvancedPlaceListElement`	`AdvancedPlaceListElement([options])` Parameter: `options: AdvancedPlaceListElementOptions optional`

Attribute
`attributionPosition` attr: attribution-position	Eingabetyp: `PlaceSearchAttributionPosition optional` Ausgabetyp: `PlaceSearchAttributionPosition` Standard: `PlaceSearchAttributionPosition.TOP` Die Position des Attributionslogos und der Schaltfläche für rechtliche Hinweise. HTML-Attribut: `attribution-position="value-name"`
`internalUsageAttributionIds` attr: internal-usage-attribution-ids	Eingabetyp: `Iterable<string> optional` Ausgabetyp: `Array<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden. HTML-Attribut: `internal-usage-attribution-ids="space separated strings"`
`orientation` attr: orientation	Eingabetyp: `PlaceSearchOrientation optional` Ausgabetyp: `PlaceSearchOrientation` Standard: `PlaceSearchOrientation.VERTICAL` Die Ausrichtungsvariante (vertikal oder horizontal) des Elements. HTML-Attribut: `orientation="value-name"`
`places` attr: places	Eingabetyp: `Iterable<Place\|string> optional` Ausgabetyp: `Array<Place>` Liste der Place-Objekte mit den IDs, die in diesem Element angezeigt werden sollen. Beachten Sie, dass möglicherweise nicht alle Orte, die in der Eigenschaft „places“ festgelegt sind, angezeigt werden, wenn sie nicht gerendert werden konnten(z.B. ungültige ID, Fehler bei der Netzwerkanfrage usw.). Die Property „places“ kann gelesen werden, um die aktuell angezeigten Orte abzurufen. HTML-Attribut: `places="space separated strings"`
`selectable` attr: selectable	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Standard: `false` Gibt an, ob die Listenelemente auswählbar sind. Wenn „true“, sind die Listenelemente Schaltflächen, die beim Klicken das Ereignis `gmp-select` auslösen. Die barrierefreie Tastaturnavigation und -auswahl wird ebenfalls unterstützt. HTML-Attribut: `selectable`
`truncationPreferred` attr: truncation-preferred	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Standard: `false` Wenn „true“, werden bestimmte Inhaltszeilen gekürzt, damit sie in eine Zeile passen, anstatt umgebrochen zu werden. HTML-Attribut: `truncation-preferred`

Slots
`details-item`	Die HTML-Vorlage, die gmp-place-Widgets enthält, die für jeden Ort in der Liste gerendert werden sollen.

CSS-Eigenschaften
`--gmp-button-border-color`	Rahmenfarbe für den Button „In Maps öffnen“.
`--gmp-button-border-radius`	Rahmenradius für die Schaltfläche „In Maps öffnen“.
`--gmp-button-border-width`	Rahmenbreite für die Schaltfläche „In Maps öffnen“.
`--gmp-card-border-radius`	Rahmenradius für Ortskarten.
`--gmp-dialog-border-radius`	Rahmenradius für das Dialogfeld zur Offenlegung von Google Maps.
`--gmp-mat-color-info`	Farbe von UI-Elementen mit informativer Bedeutung. Wird für das Symbol für barrierefreie Eingänge verwendet.
`--gmp-mat-color-negative`	Farbe von UI-Elementen mit negativer Stimmung. Wird für das Label „Geschlossen“ für die Öffnungszeiten eines Orts verwendet.
`--gmp-mat-color-neutral-container`	Containerfarbe für neutrale gefüllte UI-Elemente. Wird für Badges mit dem Datum der Rezension und zum Laden von Platzhalterformen verwendet.
`--gmp-mat-color-on-neutral-container`	Farbe von Text und Symbolen in einem neutralen Container. Wird für den Text des Überprüfungsdatums und den Text des Ladefehlers verwendet.
`--gmp-mat-color-on-secondary-container`	Farbe von Text und Symbolen vor einer sekundären Containerfarbe. Wird für Buttontext und Symbole verwendet.
`--gmp-mat-color-on-surface`	Farbe für Text und Symbole vor einer Oberflächenfarbe. Wird für Überschriften und Dialoginhalte verwendet.
`--gmp-mat-color-on-surface-variant`	Farbe mit geringerer Betonung für Text und Symbole vor einer Oberflächenfarbe. Wird für Ortsinformationen verwendet.
`--gmp-mat-color-outline-decorative`	Konturfarbe nicht interaktiver Elemente. Wird für den Containerrahmen verwendet.
`--gmp-mat-color-positive`	Farbe von UI-Elementen mit positiver Stimmung. Wird für das Label „Geöffnet“ für die Öffnungszeiten eines Ortes verwendet.
`--gmp-mat-color-primary`	Farbe von interaktivem Text und Symbolen im Vergleich zur Oberflächenfarbe. Wird für Links, die Fortschrittsanzeige und Übersichtssymbole verwendet.
`--gmp-mat-color-secondary-container`	Weniger auffällige Füllfarbe auf einer Oberfläche. Wird für Schaltflächenhintergründe verwendet.
`--gmp-mat-color-surface`	Farbe für Hintergründe. Wird für Container- und Dialoghintergründe verwendet.
`--gmp-mat-font-body-small`	Wird für Ortsinformationen verwendet.
`--gmp-mat-font-family`	Basisschriftfamilie für den gesamten Text.
`--gmp-mat-font-headline-medium`	Wird für Dialogüberschriften verwendet.
`--gmp-mat-font-label-large`	Wird für Schaltflächeninhalte verwendet.
`--gmp-mat-font-title-medium`	Wird für den Ortsnamen verwendet.
`--gmp-mat-spacing-extra-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-large`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-medium`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-mat-spacing-small`	Wird für Abstände innerhalb des Elements verwendet, z. B. für den Rand und den Abstand um Text.
`--gmp-star-rating-color`	Farbe der ausgefüllten Sterne in einer Sternebewertung.
`--gmp-thumbnail-border-radius`	Rahmenradius für die Miniaturansicht des Ortes.
`background-color`	Überschreibt die Hintergrundfarbe des Elements.
`border`	Überschreibt den Rahmen des Elements.
`border-radius`	Überschreibt den Rahmenradius des Elements.
`color-scheme`	Gibt an, in welchem Farbschema dieses Element gerendert werden kann. Weitere Informationen finden Sie in der `color-scheme`-Dokumentation. Die Standardeinstellung ist `color-scheme: light dark`.
`font-size`	Skaliert den gesamten Text und alle Symbole im Element. Die Standardeinstellung ist `16px`.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse
`gmp-error`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn eine Anfrage an das Backend abgelehnt wurde (z.B. falscher API-Schlüssel). Dieses Ereignis wird nicht weitergegeben.
`gmp-load`	`function(event)` Argumente: `event: Event optional` Dieses Ereignis wird ausgelöst, wenn das Element geladen wird und seinen Inhalt rendert. Dieses Ereignis wird nicht weitergegeben.
`gmp-select`	`function(event)` Argumente: `event: PlaceSelectEvent optional` Dieses Ereignis wird ausgelöst, wenn ein Ort aus der Liste ausgewählt wird. Enthält ein `Place`-Objekt mit der ID, dem Standort und dem Darstellungsbereich des ausgewählten Orts.

AdvancedPlaceListElementOptions-Schnittstelle

Schnittstelle google.maps.places.AdvancedPlaceListElementOptions
implementiert von AdvancedPlaceListElement

Optionen für AdvancedPlaceListElement.

Attribute
`attributionPosition` optional	Typ: `PlaceSearchAttributionPosition optional` `PlaceSearchElement.attributionPosition` ansehen.
`internalUsageAttributionIds` optional	Typ: `Iterable<string> optional` Kennungen, mit denen Aufrufe bestimmten Paketen oder OSS-Bibliotheken zugeordnet werden.
`orientation` optional	Typ: `PlaceSearchOrientation optional` `PlaceSearchElement.orientation` ansehen.
`places` optional	Typ: `Iterable<Place\|string> optional` `AdvancedPlaceListElement.places` ansehen.
`selectable` optional	Typ: `boolean optional` `PlaceSearchElement.selectable` ansehen
`truncationPreferred` optional	Typ: `boolean optional` `PlaceSearchElement.truncationPreferred` ansehen.

AdvancedPlaceItemElement-Klasse

class google.maps.places.AdvancedPlaceItemElement extends PlaceItemElement, HTMLElement implements AdvancedPlaceItemElementOptions, PlaceItemElementOptions
library "places"

Öffentlicher Webkomponenten-Wrapper (<gmp-advanced-place-item>) für erweiterte Ortlistenelemente. Mit dem benutzerdefinierten Element <gmp-advanced-place-item> wird eine einzelne Rich-Suchergebniskarte für Orte in einem Container für die erweiterte Suche oder einer Sammlung wie <gmp-advanced-place-search> oder <gmp-advanced-place-list> gerendert. Jede <gmp-advanced-place-item> enthält detaillierte Ortsinformationen, Mediencollagen, redaktionelle Zusammenfassungen und interaktive Aktionsschaltflächen, die aus untergeordneten visuellen Komponenten des Places UI Kit bestehen.

<gmp-advanced-place-item></gmp-advanced-place-item>

const {AdvancedPlaceItemElement} = await google.maps.importLibrary("places");

Slots
`basic-section-bottom`	Hinweis: Nur in der v=Alphaversion verfügbar. Ein Slot für benutzerdefinierte HTML-Inhalte, die am Ende des Abschnitts mit grundlegenden Informationen direkt unter den Haupt-Aktionsbuttons gerendert werden.
`basic-section-top`	Hinweis: Nur in der v=Alphaversion verfügbar. Ein Slot für benutzerdefinierte HTML-Inhalte, die im Bereich mit grundlegenden Informationen direkt über dem Ortsnamen gerendert werden.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

AdvancedPlaceItemElementOptions-Schnittstelle

Schnittstelle google.maps.places.AdvancedPlaceItemElementOptions erweitert PlaceItemElementOptions
implementiert von AdvancedPlaceItemElement

Optionen für AdvancedPlaceItemElement.

PlaceSearchAttributionPosition-Konstanten

Konstanten google.maps.places.PlaceSearchAttributionPosition
Bibliothek "places"

Attributionspositionen für PlaceSearchElement.

Diese Konstanten können auch als Strings verwendet werden. In TypeScript werden die Stringliterale durch den Typ PlaceSearchAttributionPositionString definiert.

const {PlaceSearchAttributionPosition} = await google.maps.importLibrary("places");

Konstanten
`BOTTOM`	Quellenangabe am unteren Rand des PlaceSearchElement
`TOP`	Quellenangabe oben im PlaceSearchElement

PlaceSearchOrientation-Konstanten

Konstanten google.maps.places.PlaceSearchOrientation
Bibliothek "places"

Ausrichtungsvarianten für PlaceSearchElement.

Diese Konstanten können auch als Strings verwendet werden. In TypeScript werden die Stringliterale durch den Typ PlaceSearchOrientationString definiert.

const {PlaceSearchOrientation} = await google.maps.importLibrary("places");

Konstanten
`HORIZONTAL`	Horizontale Ausrichtung.
`VERTICAL`	Vertikale Ausrichtung.

PlaceSelectEvent-Klasse

Klasse google.maps.places.PlaceSelectEvent erweitert Event
Bibliothek "places"

Dieses Ereignis wird ausgelöst, wenn ein Ort aus einer Liste von Orten ausgewählt wird. Greifen Sie mit event.place auf die Auswahl zu.

const {PlaceSelectEvent} = await google.maps.importLibrary("places");

Attribute
`place` readonly	Typ: `Place` Der ausgewählte Ort.

PlaceNearbySearchRequestElement-Klasse

class google.maps.places.PlaceNearbySearchRequestElement extends HTMLElement implements PlaceNearbySearchRequestElementOptions
library "places"

Konfiguriert einen PlaceSearchElement, um Ergebnisse basierend auf einer Nearby Search-Anfrage zu laden. Das Attribut locationRestriction ist erforderlich, damit das Suchelement geladen werden kann. Alle anderen konfigurierten Attribute werden ignoriert, wenn locationRestriction nicht festgelegt ist. Hängen Sie dieses Element als untergeordnetes Element eines PlaceSearchElement an, um Ergebnisse zu laden. Beispiel:

 <gmp-place-search>
   <gmp-place-nearby-search-request
     location-restriction="RADIUS@LAT,LNG"
   ></gmp-place-nearby-search-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-search>

<gmp-place-nearby-search-request
  excluded-primary-types="excluded-primary-type1 excluded-primary-type2..."
  excluded-types="excluded-type1 excluded-type2..."
  included-primary-types="included-primary-type1 included-primary-type2..."
  included-types="included-type1 included-type2..."
  location-restriction="radius@lat,lng"
  max-result-count="number"
  rank-preference="value-name">
</gmp-place-nearby-search-request>

const {PlaceNearbySearchRequestElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceNearbySearchRequestElement`	`PlaceNearbySearchRequestElement([options])` Parameter: `options: PlaceNearbySearchRequestElementOptions optional`

Attribute
`excludedPrimaryTypes` attr: excluded-primary-types	Eingabetyp: `Array<string> optional` Ausgabetyp: `Array<string> optional` Standard: `null` Ausgeschlossene primäre Ortstypen. HTML-Attribut: `excluded-primary-types="excluded-primary-type1 excluded-primary-type2..."`
`excludedTypes` attr: excluded-types	Eingabetyp: `Array<string> optional` Ausgabetyp: `Array<string> optional` Standard: `null` Ausgeschlossene Ortstypen. HTML-Attribut: `excluded-types="excluded-type1 excluded-type2..."`
`futureOpeningBusinessesIncluded`	Eingabetyp: `boolean optional` Ausgabetyp: `boolean optional` Ortsvorschläge für Unternehmen, die noch nicht eröffnet sind, aber voraussichtlich in Zukunft eröffnet werden, werden berücksichtigt.
`includedPrimaryTypes` attr: included-primary-types	Eingabetyp: `Array<string> optional` Ausgabetyp: `Array<string> optional` Standard: `null` Eingeschlossener primärer Ortstyp. HTML-Attribut: `included-primary-types="included-primary-type1 included-primary-type2..."`
`includedTypes` attr: included-types	Eingabetyp: `Array<string> optional` Ausgabetyp: `Array<string> optional` Standard: `null` Eingeschlossener Ortstyp. HTML-Attribut: `included-types="included-type1 included-type2..."`
`locationRestriction` attr: location-restriction	Eingabetyp: `Circle\|CircleLiteral optional` Ausgabetyp: `Circle optional` Standard: `null` Die Region, in der gesucht werden soll. Normalisiert in ein `Circle`-Format. HTML-Attribut: `location-restriction="radius@lat,lng"`
`maxResultCount` attr: max-result-count	Eingabetyp: `number optional` Ausgabetyp: `number optional` Standard: `null` Maximale Anzahl der zurückzugebenden Ergebnisse. HTML-Attribut: `max-result-count="number"`
`rankPreference` attr: rank-preference	Eingabetyp: `SearchNearbyRankPreference optional` Ausgabetyp: `SearchNearbyRankPreference optional` Standard: `null` Wie Ergebnisse in der Antwort sortiert werden. HTML-Attribut: `rank-preference="value-name"`

Methoden
Übernommen: `addEventListener`, `removeEventListener`

PlaceNearbySearchRequestElementOptions-Schnittstelle

Schnittstelle google.maps.places.PlaceNearbySearchRequestElementOptions
implementiert von PlaceNearbySearchRequestElement

Optionen für PlaceNearbySearchRequestElement.

Attribute
`excludedPrimaryTypes` optional	Typ: `Array<string> optional` Ausgeschlossene primäre Ortstypen. Weitere Informationen findest du unter `PlaceNearbySearchRequestElement.excludedPrimaryTypes` und `SearchNearbyRequest.excludedPrimaryTypes`.
`excludedTypes` optional	Typ: `Array<string> optional` Ausgeschlossene Ortstypen. Weitere Informationen findest du unter `PlaceNearbySearchRequestElement.excludedTypes` und `SearchNearbyRequest.excludedTypes`.
`futureOpeningBusinessesIncluded` optional	Typ: `boolean optional` Ortsvorschläge für Unternehmen, die noch nicht eröffnet sind, aber voraussichtlich in Zukunft eröffnet werden, werden berücksichtigt.
`includedPrimaryTypes` optional	Typ: `Array<string> optional` Eingeschlossene primäre Ortstypen. Weitere Informationen findest du unter `PlaceNearbySearchRequestElement.includedPrimaryTypes` und `SearchNearbyRequest.includedPrimaryTypes`.
`includedTypes` optional	Typ: `Array<string> optional` Eingeschlossene Ortstypen. Weitere Informationen findest du unter `PlaceNearbySearchRequestElement.includedTypes` und `SearchNearbyRequest.includedTypes`.
`locationRestriction` optional	Typ: `Circle\|CircleLiteral optional` Die Region, in der gesucht werden soll. Weitere Informationen findest du unter `PlaceNearbySearchRequestElement.locationRestriction` und `SearchNearbyRequest.locationRestriction`.
`maxResultCount` optional	Typ: `number optional` Maximale Anzahl der zurückzugebenden Ergebnisse. Weitere Informationen findest du unter `PlaceNearbySearchRequestElement.maxResultCount` und `SearchNearbyRequest.maxResultCount`.
`rankPreference` optional	Typ: `SearchNearbyRankPreference optional` Wie Ergebnisse in der Antwort sortiert werden. Weitere Informationen findest du unter `PlaceNearbySearchRequestElement.rankPreference` und `SearchNearbyRankPreference`.

PlaceTextSearchRequestElement-Klasse

class google.maps.places.PlaceTextSearchRequestElement extends HTMLElement implements PlaceTextSearchRequestElementOptions
library "places"

Konfiguriert einen PlaceSearchElement, um Ergebnisse basierend auf einer Textsuchanfrage zu laden. Das Attribut textQuery ist erforderlich, damit das Suchelement geladen werden kann. Alle anderen konfigurierten Attribute werden ignoriert, wenn textQuery nicht festgelegt ist. Hängen Sie dieses Element als untergeordnetes Element eines PlaceSearchElement an, um Ergebnisse zu laden. Beispiel:

 <gmp-place-search>
   <gmp-place-text-search-request
     text-query="QUERY"
   ></gmp-place-text-search-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-search>

<gmp-place-text-search-request
  ev-connector-types="ev-connector-type1 ev-connector-type2..."
  ev-minimum-charging-rate-kw="number"
  included-type="type"
  is-open-now
  location-bias="lat,lng"
  location-restriction="southwest-lat,southwest-lng|northeast-lat,northeast-lng"
  max-result-count="number"
  min-rating="number"
  price-levels="price-level1 price-level2..."
  rank-preference="value-name"
  text-query="string"
  use-strict-type-filtering>
</gmp-place-text-search-request>

const {PlaceTextSearchRequestElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceTextSearchRequestElement`	`PlaceTextSearchRequestElement([options])` Parameter: `options: PlaceTextSearchRequestElementOptions optional`

Attribute
`evConnectorTypes` attr: ev-connector-types	Eingabetyp: `Array<EVConnectorType> optional` Ausgabetyp: `Array<EVConnectorType> optional` Standard: `null` Die Liste der bevorzugten Ladesteckertypen für Elektrofahrzeuge. HTML-Attribut: `ev-connector-types="ev-connector-type1 ev-connector-type2..."`
`evMinimumChargingRateKw` attr: ev-minimum-charging-rate-kw	Eingabetyp: `number optional` Ausgabetyp: `number optional` Standard: `null` Erforderliche Mindestladeleistung in Kilowatt. HTML-Attribut: `ev-minimum-charging-rate-kw="number"`
`futureOpeningBusinessesIncluded`	Eingabetyp: `boolean optional` Ausgabetyp: `boolean optional` Ortsvorschläge für Unternehmen, die noch nicht eröffnet sind, aber voraussichtlich in Zukunft eröffnet werden, werden berücksichtigt.
`includedType` attr: included-type	Eingabetyp: `string optional` Ausgabetyp: `string optional` Standard: `null` Der angeforderte Ortstyp. HTML-Attribut: `included-type="type"`
`isOpenNow` attr: is-open-now	Eingabetyp: `boolean optional` Ausgabetyp: `boolean optional` Standard: `null` Wird verwendet, um die Suche auf Orte zu beschränken, die derzeit geöffnet sind. HTML-Attribut: `is-open-now`
`locationBias` attr: location-bias	Eingabetyp: `LocationBias optional` Ausgabetyp: `LatLngAltitude\|LatLngBounds\|Circle\|string optional` Standard: `null` Standortgewichtung für die Suche. HTML-Attribut: `location-bias="lat,lng"` `location-bias="lat,lng[,altitude]"` `location-bias="swlat,swlng\|nelat,nelng"` `location-bias="radius@lat,lng"` `location-bias="IP_BIAS"`
`locationRestriction` attr: location-restriction	Eingabetyp: `LatLngBounds\|LatLngBoundsLiteral optional` Ausgabetyp: `LatLngBounds optional` Standard: `null` Standortbeschränkung für die Suche. Normalisiert in ein `LatLngBounds`-Format. HTML-Attribut: `location-restriction="southwest-lat,southwest-lng\|northeast-lat,northeast-lng"`
`maxResultCount` attr: max-result-count	Eingabetyp: `number optional` Ausgabetyp: `number optional` Standard: `null` Maximale Anzahl der zurückzugebenden Ergebnisse. HTML-Attribut: `max-result-count="number"`
`minRating` attr: min-rating	Eingabetyp: `number optional` Ausgabetyp: `number optional` Standard: `null` Ergebnisse herausfiltern, deren durchschnittliche Nutzerbewertung unter diesem Grenzwert liegt. HTML-Attribut: `min-rating="number"`
`priceLevels` attr: price-levels	Eingabetyp: `Array<PriceLevel> optional` Ausgabetyp: `Array<PriceLevel> optional` Standard: `null` Wird verwendet, um die Suche auf Orte zu beschränken, die mit bestimmten Preisstufen gekennzeichnet sind. HTML-Attribut: `price-levels="price-level1 price-level2..."`
`rankPreference` attr: rank-preference	Eingabetyp: `SearchByTextRankPreference optional` Ausgabetyp: `SearchByTextRankPreference optional` Standard: `null` Wie Ergebnisse in der Antwort sortiert werden. HTML-Attribut: `rank-preference="value-name"`
`textQuery` attr: text-query	Eingabetyp: `string optional` Ausgabetyp: `string optional` Standard: `null` Die Textanfrage für die Textsuche. HTML-Attribut: `text-query="string"`
`useStrictTypeFiltering` attr: use-strict-type-filtering	Eingabetyp: `boolean optional` Ausgabetyp: `boolean optional` Standard: `null` Wird verwendet, um eine strenge Typfilterung für „includedType“ festzulegen. HTML-Attribut: `use-strict-type-filtering`

Methoden
Übernommen: `addEventListener`, `removeEventListener`

PlaceTextSearchRequestElementOptions-Schnittstelle

Schnittstelle google.maps.places.PlaceTextSearchRequestElementOptions
implementiert von PlaceTextSearchRequestElement

Optionen für PlaceTextSearchRequestElement.

Attribute
`evConnectorTypes` optional	Typ: `Array<EVConnectorType> optional` Die Liste der bevorzugten Ladesteckertypen für Elektrofahrzeuge. Weitere Informationen findest du unter `SearchByTextRequest.evSearchOptions` und `PlaceTextSearchRequestElement.evConnectorTypes`.
`evMinimumChargingRateKw` optional	Typ: `number optional` Erforderliche Mindestladeleistung in Kilowatt. Weitere Informationen findest du unter `SearchByTextRequest.evSearchOptions` und `PlaceTextSearchRequestElement.evMinimumChargingRateKw`.
`futureOpeningBusinessesIncluded` optional	Typ: `boolean optional` Ortsvorschläge für Unternehmen, die noch nicht eröffnet sind, aber voraussichtlich in Zukunft eröffnet werden, werden berücksichtigt.
`includedType` optional	Typ: `string optional` Der angeforderte Ortstyp. Weitere Informationen findest du unter `SearchByTextRequest.includedType` und `PlaceTextSearchRequestElement.includedType`.
`isOpenNow` optional	Typ: `boolean optional` Wird verwendet, um die Suche auf Orte zu beschränken, die derzeit geöffnet sind. Weitere Informationen findest du unter `SearchByTextRequest.isOpenNow` und `PlaceTextSearchRequestElement.isOpenNow`.
`locationBias` optional	Typ: `LocationBias optional` Standortgewichtung für die Suche. Weitere Informationen findest du unter `SearchByTextRequest.locationBias` und `PlaceTextSearchRequestElement.locationBias`.
`locationRestriction` optional	Typ: `LatLngBounds\|LatLngBoundsLiteral optional` Standortbeschränkung für die Suche. Weitere Informationen findest du unter `SearchByTextRequest.locationRestriction` und `PlaceTextSearchRequestElement.locationRestriction`.
`maxResultCount` optional	Typ: `number optional` Maximale Anzahl der zurückzugebenden Ergebnisse. Weitere Informationen findest du unter `SearchByTextRequest.maxResultCount` und `PlaceTextSearchRequestElement.maxResultCount`.
`minRating` optional	Typ: `number optional` Ergebnisse herausfiltern, deren durchschnittliche Nutzerbewertung unter diesem Grenzwert liegt. Weitere Informationen findest du unter `SearchByTextRequest.minRating` und `PlaceTextSearchRequestElement.minRating`.
`priceLevels` optional	Typ: `Array<PriceLevel> optional` Wird verwendet, um die Suche auf Orte zu beschränken, die mit bestimmten Preisstufen gekennzeichnet sind. Weitere Informationen findest du unter `SearchByTextRequest.priceLevels` und `PlaceTextSearchRequestElement.priceLevels`.
`rankPreference` optional	Typ: `SearchByTextRankPreference optional` Wie Ergebnisse in der Antwort sortiert werden. Weitere Informationen findest du unter `SearchByTextRequest.rankPreference` und `PlaceTextSearchRequestElement.rankPreference`.
`textQuery` optional	Typ: `string optional` Die Textanfrage für die Textsuche. Weitere Informationen findest du unter `SearchByTextRequest.textQuery` und `PlaceTextSearchRequestElement.textQuery`.
`useStrictTypeFiltering` optional	Typ: `boolean optional` Wird verwendet, um eine strenge Typfilterung für `SearchByTextRequest.includedType` festzulegen. Weitere Informationen findest du unter `SearchByTextRequest.useStrictTypeFiltering` und `PlaceTextSearchRequestElement.useStrictTypeFiltering`.

Autocomplete-Klasse

Klasse google.maps.places.Autocomplete erweitert MVCObject
Bibliothek "places"

Eingestellt: Seit dem 1. März 2025 ist „google.maps.places.Autocomplete“ für Neukunden nicht mehr verfügbar. Bitte verwenden Sie stattdessen „PlaceAutocompleteElement“. Derzeit ist noch nicht bekannt, zu welchem Datum google.maps.places.Autocomplete eingestellt wird, doch empfehlen wir bereits jetzt die Verwendung von PlaceAutocompleteElement anstelle von google.maps.places.Autocomplete. Wir stellen für google.maps.places.Autocomplete weiterhin bei schwerwiegenden Regressionen Fehlerkorrekturen bereit, doch werden bestehende Fehler in google.maps.places.Autocomplete nicht mehr behoben. Die Unterstützung endet erst 12 Monate nach Bekanntgabe der Einstellungsphase. Weitere Informationen finden Sie unter https://developers.google.com/maps/legacy und die Migrationsanleitung unter https://developers.google.com/maps/documentation/javascript/places-migration-overview.

Ein Widget, das Ortsvorschläge basierend auf der Texteingabe eines Nutzers liefert. Es wird an ein Eingabeelement vom Typ text angehängt und überwacht die Texteingabe in diesem Feld. Die Liste der Vervollständigungen wird als Drop-down-Liste angezeigt und während der Texteingabe aktualisiert.

const {Autocomplete} = await google.maps.importLibrary("places");

Konstruktor
`Autocomplete`	`Autocomplete(inputField[, opts])` Parameter: `inputField: HTMLInputElement` Das Textfeld `<input>`, an das die `Autocomplete` angehängt werden soll. `opts: AutocompleteOptions optional`-Optionen. Erstellt eine neue Instanz von `Autocomplete`, die mit den angegebenen Optionen an das angegebene Eingabetextfeld angehängt wird.

Methoden
`getBounds`	`getBounds()` Parameter: Keine Rückgabewert: `LatLngBounds\|undefined` Die Biasing-Grenzen. Gibt die Grenzen zurück, auf die die Vervollständigungen ausgerichtet sind.
`getFields`	`getFields()` Parameter: Keine Rückgabewert: `Array<string>\|undefined` Gibt die Felder zurück, die für den Ort in der Antwort mit den Details enthalten sein sollen, wenn die Details erfolgreich abgerufen wurden. Eine Liste der Felder finden Sie unter `PlaceResult`.
`getPlace`	`getPlace()` Parameter: Keine Rückgabewert: `PlaceResult` Der vom Nutzer ausgewählte Ort. Gibt die Details des vom Nutzer ausgewählten Orts zurück, wenn die Details erfolgreich abgerufen wurden. Andernfalls wird ein Stub-Place-Objekt zurückgegeben, wobei die Eigenschaft `name` auf den aktuellen Wert des Eingabefelds festgelegt ist.
`setBounds`	`setBounds(bounds)` Parameter: `bounds: LatLngBounds\|LatLngBoundsLiteral optional` Die Bias-Grenzwerte. Rückgabewert: Keiner Legt den bevorzugten Bereich fest, für den Ortsergebnisse zurückgegeben werden sollen. Bei den Ergebnissen werden Orte innerhalb dieses Gebiets bevorzugt, sind aber nicht auf sie beschränkt.
`setComponentRestrictions`	`setComponentRestrictions(restrictions)` Parameter: `restrictions: ComponentRestrictions optional`: Die Nutzungseinschränkungen. Rückgabewert: Keiner Legt die Komponentenbeschränkungen fest. Mit Komponentenbeschränkungen werden Vervollständigungen auf die übergeordnete Komponente beschränkt. Beispiel: das Land.
`setFields`	`setFields(fields)` Parameter: `fields: Array<string> optional` Rückgabewert: Keiner Legt die Felder fest, die für den Ort in der Antwort mit den Details enthalten sein sollen, wenn die Details erfolgreich abgerufen wurden. Eine Liste der Felder finden Sie unter `PlaceResult`.
`setOptions`	`setOptions(options)` Parameter: `options: AutocompleteOptions optional` Rückgabewert: Keiner
`setTypes`	`setTypes(types)` Parameter: `types: Array<string> optional` Die Arten von Vorhersagen, die einbezogen werden sollen. Rückgabewert: Keiner Legt die Typen der zurückzugebenden Vervollständigungen fest. Informationen zu unterstützten Typen finden Sie im Entwicklerhandbuch. Wenn keine Typen angegeben sind, werden alle Typen zurückgegeben.
Übernommen: `addListener`, `bindTo`, `get`, `notify`, `set`, `setValues`, `unbind`, `unbindAll`

Ereignisse

place_changed

function()

Argumente: Keine

Dieses Ereignis wird ausgelöst, wenn ein PlaceResult für einen vom Nutzer ausgewählten Ort verfügbar gemacht wird.
Wenn der Nutzer den Namen eines Ortes eingibt, der nicht vom Steuerelement vorgeschlagen wurde, und die Eingabetaste drückt, oder wenn eine Place Details-Anfrage fehlschlägt, enthält PlaceResult die Nutzereingabe in der Property name. Es sind keine anderen Properties definiert.

AutocompleteOptions-Schnittstelle

Schnittstelle google.maps.places.AutocompleteOptions

Die Optionen, die für ein Autocomplete-Objekt festgelegt werden können.

Attribute
`bounds` optional	Typ: `LatLngBounds\|LatLngBoundsLiteral optional` Das Gebiet, in dem nach Orten gesucht werden soll.
`componentRestrictions` optional	Typ: `ComponentRestrictions optional` Die Einschränkungen der Komponente. Mit Komponentenbeschränkungen werden Vervollständigungen auf die übergeordnete Komponente beschränkt. Beispiel: das Land.
`fields` optional	Typ: `Array<string> optional` Felder, die für den Ort in der Antwort mit den Details enthalten sein sollen, wenn die Details erfolgreich abgerufen wurden. Diese Felder werden in Rechnung gestellt. Wenn `['ALL']` übergeben wird, werden alle verfügbaren Felder zurückgegeben und in Rechnung gestellt. Bei Produktions-Deployments wird hiervon abgeraten. Eine Liste der Felder finden Sie unter `PlaceResult`. Verschachtelte Felder können mit Punktpfaden angegeben werden (z. B. `"geometry.location"`). Der Standardwert ist `['ALL']`.
`placeIdOnly` optional	Eingestellt: `placeIdOnly` wurde am 15. Januar 2019 eingestellt und wird am 15. Januar 2020 deaktiviert. Verwenden Sie stattdessen `AutocompleteOptions.fields`: `fields: ['place_id', 'name', 'types']`. Typ: `boolean optional` Gibt an, ob nur Orts-IDs abgerufen werden sollen. Das PlaceResult, das beim Auslösen des „place_changed“-Ereignisses verfügbar gemacht wird, enthält nur die Felder „place_id“, „types“ und „name“. „place_id“, „types“ und „description“ werden vom Autocomplete-Dienst zurückgegeben. Standardmäßig deaktiviert.
`strictBounds` optional	Typ: `boolean optional` Ein boolescher Wert, der angibt, dass das Autocomplete-Widget nur die Orte zurückgeben soll, die sich zum Zeitpunkt des Sendens der Anfrage innerhalb der Grenzen des Autocomplete-Widgets befinden. Wenn Sie „strictBounds“ auf `false` setzen (Standardeinstellung), werden bei den Ergebnissen Orte innerhalb des Gebiets bevorzugt, sind aber nicht auf sie beschränkt.
`types` optional	Typ: `Array<string> optional` Die Typen von Vervollständigungen, die zurückgegeben werden sollen. Informationen zu unterstützten Typen finden Sie im Entwicklerhandbuch. Wenn keine Typen angegeben sind, werden alle Typen zurückgegeben.

Klasse google.maps.places.SearchBox erweitert MVCObject
Bibliothek "places"

Ein Widget, das Vervollständigungen für Suchanfragen basierend auf der Texteingabe eines Nutzers liefert. Es wird an ein Eingabeelement vom Typ text angehängt und überwacht die Texteingabe in diesem Feld. Die Liste der Vervollständigungen wird als Drop-down-Liste angezeigt und während der Texteingabe aktualisiert.

const {SearchBox} = await google.maps.importLibrary("places");

Konstruktor
`SearchBox`	`SearchBox(inputField[, opts])` Parameter: `inputField: HTMLInputElement` `opts: SearchBoxOptions optional` Erstellt eine neue Instanz von `SearchBox`, die mit den angegebenen Optionen an das angegebene Eingabetextfeld angehängt wird.

Methoden
`getBounds`	`getBounds()` Parameter: Keine Rückgabewert: `LatLngBounds\|undefined` Gibt die Grenzen zurück, auf die Suchvorschläge ausgerichtet sind.
`getPlaces`	`getPlaces()` Parameter: Keine Rückgabewert: `Array<PlaceResult>\|undefined` Gibt die vom Nutzer ausgewählte Abfrage zurück, die mit dem Ereignis `places_changed` verwendet werden soll.
`setBounds`	`setBounds(bounds)` Parameter: `bounds: LatLngBounds\|LatLngBoundsLiteral optional` Rückgabewert: Keiner Legt die Region fest, die für die Gewichtung von Abfragevorhersagen verwendet werden soll. Die Ergebnisse werden nur auf diesen Bereich ausgerichtet und nicht vollständig darauf beschränkt.
Übernommen: `addListener`, `bindTo`, `get`, `notify`, `set`, `setValues`, `unbind`, `unbindAll`

Ereignisse
`places_changed`	`function()` Argumente: Keine Dieses Ereignis wird ausgelöst, wenn der Nutzer eine Suchanfrage auswählt. `getPlaces` sollte verwendet werden, um neue Orte abzurufen.

SearchBoxOptions-Schnittstelle

Schnittstelle google.maps.places.SearchBoxOptions

Die Optionen, die für ein SearchBox-Objekt festgelegt werden können.

Attribute
`bounds` optional	Typ: `LatLngBounds\|LatLngBoundsLiteral optional` Das Gebiet, auf das die Vervollständigungen von Suchanfragen ausgerichtet werden sollen. Bei den Vervollständigungen werden Suchanfragen innerhalb dieses Gebiets bevorzugt, sind aber nicht auf sie beschränkt.

Klasse PlaceContextualElement

class google.maps.places.PlaceContextualElement extends HTMLElement implements PlaceContextualElementOptions
library "places"

Ein Widget, das das Kontext-Token verwendet, um eine kontextbezogene Ansicht der Antwort der Fundierung mit Google Maps anzuzeigen.

<gmp-place-contextual
  context-token="string">
</gmp-place-contextual>

const {PlaceContextualElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceContextualElement`	`PlaceContextualElement([options])` Parameter: `options: PlaceContextualElementOptions optional`

Attribute
`contextToken` attr: context-token	Eingabetyp: `string optional` Ausgabetyp: `string optional` Das Kontext-Token. HTML-Attribut: `context-token="string"`

Methoden
Übernommen: `addEventListener`, `removeEventListener`

PlaceContextualElementOptions-Schnittstelle

Schnittstelle google.maps.places.PlaceContextualElementOptions
implementiert von PlaceContextualElement

Optionen für PlaceContextualElement.

Attribute
`contextToken` optional	Typ: `string optional` Das Kontext-Token, das von der Antwort der Fundierung mit Google Maps bereitgestellt wird.

PlaceContextualListConfigElement-Klasse

class google.maps.places.PlaceContextualListConfigElement extends HTMLElement implements PlaceContextualListConfigElementOptions
library "places"

Ein HTML-Element, mit dem Optionen für die Listenansicht des kontextbezogenen Elements für Orte konfiguriert werden.

<gmp-place-contextual-list-config
  layout="value-name"
  map-hidden>
</gmp-place-contextual-list-config>

const {PlaceContextualListConfigElement} = await google.maps.importLibrary("places");

Konstruktor
`PlaceContextualListConfigElement`	`PlaceContextualListConfigElement([options])` Parameter: `options: PlaceContextualListConfigElementOptions optional`

Attribute
`layout` attr: layout	Eingabetyp: `PlaceContextualListLayout optional` Ausgabetyp: `PlaceContextualListLayout` Das Layout. HTML-Attribut: `layout="value-name"`
`mapHidden` attr: map-hidden	Eingabetyp: `boolean optional` Ausgabetyp: `boolean` Gibt an, ob die Karte ausgeblendet ist. HTML-Attribut: `map-hidden`

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Schnittstelle PlaceContextualListConfigElementOptions

Schnittstelle google.maps.places.PlaceContextualListConfigElementOptions
implementiert von PlaceContextualListConfigElement

Optionen für PlaceContextualListConfigElement.

Attribute
`layout` optional	Typ: `PlaceContextualListLayout optional` Standard: `PlaceContextualListLayout.VERTICAL` Das Layout.
`mapHidden` optional	Typ: `boolean optional` Standard: `false` „True“, wenn die Karte ausgeblendet werden soll.

PlaceContextualListLayout-Konstanten

Konstanten google.maps.places.PlaceContextualListLayout
Bibliothek "places"

Die Liste der Layouts, die das kontextbezogene Element für Orte für die Listenansicht unterstützt.

Diese Konstanten können auch als Strings verwendet werden. In TypeScript werden die Stringliterale durch den Typ PlaceContextualListLayoutString definiert.

const {PlaceContextualListLayout} = await google.maps.importLibrary("places");

Konstanten
`COMPACT`	Kompaktes Listenlayout: Listenelemente werden als Links in einer einzigen Zeile dargestellt, wobei Überläufe in einer Drop-down-Liste angezeigt werden.
`VERTICAL`	Vertikales Listenlayout: Listenelemente werden als Karten in einer vertikalen Liste gerendert.

PlacePinElement-Klasse

class google.maps.places.PlacePinElement extends HTMLElement implements PlacePinElementOptions
library "places"

Zeigt eine Kartenmarkierung für einen Ort an, wobei das Kategoriesymbol oder Foto des Orts verwendet wird. Hängen Sie PlaceDetailsPlaceRequestElement oder PlaceDetailsLocationRequestElement an, um den Ort anzugeben. Verwenden Sie die Markierung als Inhalt eines AdvancedMarkerElement. Wird in 3D-Karten nicht unterstützt.

Beispiel:

 <gmp-advanced-marker>
   <gmp-place-pin>
     <gmp-place-details-place-request
       place="PLACE_ID"
     ></gmp-place-details-place-request>
     <gmp-place-rating></gmp-place-rating>
   </gmp-place-pin>
 </gmp-advanced-marker>

Wenn Sie dieses Element verwenden möchten, müssen Sie die Places UI Kit API für Ihr Projekt in der Google Cloud Console aktivieren.

<gmp-place-pin
  icon="value-name"
  scale="number">
</gmp-place-pin>

const {PlacePinElement} = await google.maps.importLibrary("places");

Konstruktor
`PlacePinElement`	`PlacePinElement([options])` Parameter: `options: PlacePinElementOptions optional`

Attribute
`icon` attr: icon	Eingabetyp: `PlacePinIcon optional` Ausgabetyp: `PlacePinIcon` Standard: `PlacePinIcon.TYPE` Das Symbol, das in der Markierung angezeigt wird. `PlacePinIcon` ansehen. HTML-Attribut: `icon="value-name"`
`photoRendered` readonly	Typ: `boolean` Schreibgeschützt. „True“, wenn auf der Markierung das Foto des Orts angezeigt wird. Immer „false“, wenn `icon` nicht `PHOTO` ist. Wenn `icon` den Wert `PHOTO` hat, der Ort aber kein Foto hat oder das Foto nicht geladen werden konnte, ist der Wert „false“ und auf der Markierung wird stattdessen das Symbol für den Ortstyp angezeigt. Wird vor dem Auslösen von `gmp-load` festgelegt.
`place` readonly	Typ: `Place optional` Schreibgeschützt. Place-Objekt mit der ID, dem Standort und dem Darstellungsbereich des aktuell gerenderten Orts. `undefined`, wenn der Ort noch nicht geladen wurde oder nicht geladen werden konnte.
`scale` attr: scale	Eingabetyp: `number optional` Ausgabetyp: `number` Standard: `1` Größenmultiplikator für die Markierung. HTML-Attribut: `scale="number"`

Slots
`default`	Optionale Inhalte, die auf der Markierung angezeigt werden, z. B. ein `PlaceRatingElement`, ein benutzerdefiniertes `<span>` oder Text. Untergeordnete Light-DOM-Elemente werden direkt in die Markierung eingefügt. Wo die Inhalte angezeigt werden, hängt von `icon` ab: neben dem Symbol für den Ortstyp bei `TYPE`, als Badge auf dem Foto bei `PHOTO` und als Hauptinhalt der Markierung bei `NONE`.

CSS-Eigenschaften
`--gmp-background`	Hintergrundfarbe der Markierung: die Pill, der Fotorahmen, das Fotobadge, der Schnabel und der Rahmen der Markierung für den Ortstyp.
`--gmp-border-radius`	Rahmenradius des Pill-Elements (Ortstyp-Symbol mit eingefügtem Inhalt oder nur eingefügter Inhalt) und des Fotorahmens in `PHOTO`-Pins. Die Standardeinstellung ist `30px` für ein Symbol für den Ortstyp mit eingefügten Inhalten, `12px` nur für eingefügte Inhalte und ein `12px`-Fotorahmen. Gilt nicht für den Ortstyp „Pin“ ohne Slotted Content.
`--gmp-glyph-background`	Hintergrundfarbe hinter der Glyphe für den Ortstyp. Die Standardeinstellung ist die `iconBackgroundColor` des Orts.
`--gmp-glyph-color`	Farbe des Symbols für den Ortstyp. Wird immer angewendet, wenn das Symbol angezeigt wird, auch wenn eine `PHOTO`-Markierung auf das Symbol für den Ortstyp zurückgreift.

Methoden
Übernommen: `addEventListener`, `removeEventListener`

Ereignisse

gmp-error

function(event)

Argumente:

event: Event optional

Dieses Ereignis wird ausgelöst, wenn die Markierung überhaupt nicht gerendert werden kann, z. B. aufgrund eines Netzwerkfehlers, eines Fehlers bei den Anmeldedaten (z. B. eines falschen API-Schlüssels), einer Orts-ID, die nicht aufgelöst werden kann, oder eines Ortes ohne Standort. Die PIN ist ausgeblendet. Dieses Ereignis wird nicht weitergegeben.

gmp-load

function(event)

Argumente:

event: Event optional

Dieses Ereignis wird ausgelöst, sobald die Ortsdetails geladen und die Markierung gerendert wurde. Wenn icon den Wert PHOTO hat, wird es nur ausgelöst, nachdem das Foto entweder geladen wurde oder fehlgeschlagen ist. Ein Fotofehler allein löst gmp-error nicht aus. Lesen Sie den geladenen Ort aus PlacePinElement.place und ob das Foto angezeigt wird, aus PlacePinElement.photoRendered. Dieses Ereignis wird nicht weitergegeben.

PlacePinElementOptions-Schnittstelle

Schnittstelle google.maps.places.PlacePinElementOptions
implementiert von PlacePinElement

Optionen zum Erstellen eines PlacePinElement.

Attribute
`icon` optional	Typ: `PlacePinIcon optional` `PlacePinElement.icon` ansehen.
`scale` optional	Typ: `number optional` `PlacePinElement.scale` ansehen.

PlacePinIcon-Konstanten

Konstanten google.maps.places.PlacePinIcon
Bibliothek "places"

Symboloptionen für PlacePinElement. Standardmäßig ist TYPE ausgewählt. Wenn die für das ausgewählte Symbol erforderlichen Daten fehlen, wird die Markierung auf TYPE zurückgesetzt. Wenn die für TYPE erforderlichen Daten fehlen, wird stattdessen ein generisches Symbol angezeigt.

Diese Konstanten können auch als Strings verwendet werden. In TypeScript werden die Stringliterale durch den Typ PlacePinIconString definiert.

const {PlacePinIcon} = await google.maps.importLibrary("places");

Konstanten
`NONE`	Es wird kein Symbol angezeigt, sondern nur der Inhalt im Slot.
`PHOTO`	Zeigt das Foto des Ortes in einem Kreis an. Wenn für den Ort kein Foto vorhanden ist, wird auf `TYPE` zurückgegriffen.
`TYPE`	Zeigt das Kategoriesymbol des Orts an.

Places Widgets Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

PlaceAutocompleteElement-Klasse

Konstruktor

Attribute

Slots

Teile

CSS-Eigenschaften

Methoden

Ereignisse

Schnittstelle PlaceAutocompleteElementOptions

Attribute

PlacePredictionSelectEvent-Klasse

Attribute

BasicPlaceAutocompleteElement-Klasse

Konstruktor

Attribute

Slots

Teile

CSS-Eigenschaften

Methoden

Ereignisse

BasicPlaceAutocompleteElementOptions-Schnittstelle

Attribute

Klasse PlaceDetailsElement

Konstruktor

Attribute

CSS-Eigenschaften

Methoden

Ereignisse

Schnittstelle PlaceDetailsElementOptions

Attribute

Klasse PlaceDetailsCompactElement

Konstruktor

Attribute

CSS-Eigenschaften

Methoden

Ereignisse

PlaceDetailsCompactElementOptions-Schnittstelle

Attribute

AdvancedPlaceDetailsElement-Klasse

Konstruktor

Attribute

Slots

CSS-Eigenschaften

Methoden

Ereignisse

AdvancedPlaceDetailsElementOptions-Schnittstelle

Attribute

AdvancedPlaceDetailsCompactElement-Klasse

Konstruktor

Attribute

Slots

CSS-Eigenschaften

Methoden

Ereignisse

AdvancedPlaceDetailsCompactElementOptions-Schnittstelle

Attribute

PlaceDetailsOrientation-Konstanten

Konstanten

PlaceDetailsPlaceRequestElement-Klasse

Konstruktor

Attribute

Methoden

PlaceDetailsPlaceRequestElementOptions-Schnittstelle

Attribute

PlaceDetailsLocationRequestElement-Klasse

Konstruktor

Attribute

Methoden

PlaceDetailsLocationRequestElementOptions-Schnittstelle

Attribute

Klasse PlaceSearchElement

Konstruktor

Attribute

CSS-Eigenschaften

Methoden

Ereignisse

Schnittstelle PlaceSearchElementOptions

Attribute

PlaceItemElement-Klasse

Places Widgets