Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

# Verwenden Sie das Amazon Location MapLibre Geocoder GL-Plugin
<a name="dev-maplibre-geocoder"></a>

Das Amazon Location MapLibre Geocoder-Plugin wurde entwickelt, um Ihnen die Integration von Amazon Location-Funktionen in Ihre JavaScript Anwendungen zu erleichtern, wenn Sie mit dem Rendern und Geokodieren von Karten mithilfe der Bibliothek arbeiten. [maplibre-gl-geocoder](https://github.com/maplibre/maplibre-gl-geocoder)

## Installation
<a name="geocoder-installation"></a>

Installieren Sie das Amazon Location MapLibre Geocoder-Plugin von NPM zur Verwendung mit Modulen. Geben Sie diesen Befehl ein:

```
npm install @aws/amazon-location-for-maplibre-gl-geocoder
```

Sie können HTML- und CSS-Dateien auch zur direkten Verwendung im Browser mit einem Skript importieren:

```
<script src="https://cdn.jsdelivr.net/npm/@aws/amazon-location-for-maplibre-gl-geocoder@2"></script>
<link
  href="https://cdn.jsdelivr.net/npm/@aws/amazon-location-for-maplibre-gl-geocoder@2/dist/amazon-location-for-mlg-styles.css"
  rel="stylesheet"
/>
```

## Verwendung mit Modul — eigenständiges GeoPlaces SDK
<a name="geocoder-module"></a>

In diesem Beispiel wird das [AWS SDK für JavaScript V3](https://github.com/aws/aws-sdk-js-v3) verwendet, GeoPlacesClient um ein [AuthHelper](https://github.com/aws-geospatial/amazon-location-utilities-auth-helper-js)für die Bibliothek bereitzustellen und um das zu authentifizieren. GeoPlacesClient Es aktiviert alles APIs für den Geocoder.

```
// Import MapLibre GL JS
import maplibregl from "maplibre-gl";
// Import from the AWS JavaScript SDK V3
import { GeoPlacesClient } from "@aws-sdk/client-geo-places";
// Import the utility functions
import { withAPIKey } from "@aws/amazon-location-utilities-auth-helper";
// Import the AmazonLocationMaplibreGeocoder
import {
  buildAmazonLocationMaplibreGeocoder,
  AmazonLocationMaplibreGeocoder,
} from "@aws/amazon-location-for-maplibre-gl-geocoder";

const apiKey = "<API Key>";
const mapName = "Standard";
const region = "<Region>"; // region containing Amazon Location API Key

// Create an authentication helper instance using an API key and region
const authHelper = await withAPIKey(apiKey, region);

const client = new GeoPlacesClient(authHelper.getClientConfig());

// Render the map
const map = new maplibregl.Map({
  container: "map",
  center: [-123.115898, 49.295868],
  zoom: 10,
  style: `https://maps.geo.${region}.amazonaws.com/v2/styles/${mapStyle}/descriptor?key=${apiKey}`,
});

// Gets an instance of the AmazonLocationMaplibreGeocoder Object.
const amazonLocationMaplibreGeocoder = buildAmazonLocationMaplibreGeocoder(client, { enableAll: true });

// Now we can add the Geocoder to the map.
map.addControl(amazonLocationMaplibreGeocoder.getPlacesGeocoder());
```

## Verwendung mit einem Browser — eigenständiges SDK GeoPlaces
<a name="geocoder-browser"></a>

In diesem Beispiel wird der Amazon Location-Client verwendet, um eine Anfrage zu stellen, die sich mithilfe eines API-Schlüssels authentifiziert.

**Anmerkung**  
Einige dieser Beispiele verwenden den Amazon-Standort GeoPlacesClient. Dieser Client basiert auf dem [AWS SDK für JavaScript V3](https://github.com/aws/aws-sdk-js-v3) und ermöglicht das Aufrufen von Amazon Location über ein Skript, auf das in einer HTML-Datei verwiesen wird.

Fügen Sie Folgendes in eine HTML-Datei ein:

```
<!-- Import the Amazon Location For Maplibre Geocoder -->
<script src="https://cdn.jsdelivr.net/npm/@aws/amazon-location-for-maplibre-gl-geocoder@2"></script>
<link
  href="https://cdn.jsdelivr.net/npm/@aws/amazon-location-for-maplibre-gl-geocoder@2/dist/amazon-location-for-mlg-styles.css"
  rel="stylesheet"
/>
<!-- Import the Amazon GeoPlacesClient -->
<script src="https://cdn.jsdelivr.net/npm/@aws/amazon-location-client@1"></script>
```

Nehmen Sie Folgendes in eine JavaScript Datei auf:

```
const apiKey = "<API Key>";
const mapStyle = "Standard";
const region = "<Region>"; // region containing Amazon Location API key

// Create an authentication helper instance using an API key and region
const authHelper = await amazonLocationClient.withAPIKey(apiKey, region);

const client = new amazonLocationClient.GeoPlacesClient(authHelper.getClientConfig());

// Render the map
const map = new maplibregl.Map({
  container: "map",
  center: [-123.115898, 49.295868],
  zoom: 10,
  style: `https://maps.geo.${region}.amazonaws.com/v2/styles/${mapStyle}/descriptor?key=${apiKey}`,
});

// Initialize the AmazonLocationMaplibreGeocoder object
const amazonLocationMaplibreGeocoderObject = amazonLocationMaplibreGeocoder.buildAmazonLocationMaplibreGeocoder(
  client,
  { enableAll: true },
);

// Use the AmazonLocationWithMaplibreGeocoder object to add a geocoder to the map.
map.addControl(amazonLocationMaplibreGeocoderObject.getPlacesGeocoder());
```

## Funktionen
<a name="geocoder-functions"></a>

Im Folgenden sind die Funktionen aufgeführt, die im Amazon Location MapLibre Geocoder-Plugin verwendet werden:
+ `buildAmazonLocationMaplibreGeocoder`

  Diese Klasse erstellt eine Instanz von`AmazonLocationMaplibreGeocder`, die der Einstiegspunkt für alle anderen Aufrufe ist.

  Verwendung eigenständiger `GeoPlacesClient` API-Aufrufe (Client ist Instanz von`GeoPlacesClient`):

  ```
  const amazonLocationMaplibreGeocoder = buildAmazonLocationMaplibreGeocoder(client, { enableAll: true });
  ```

  Verwendung konsolidierter `LocationClient` API-Aufrufe (Client ist Instanz von`LocationClient`):

  ```
  const amazonLocationMaplibreGeocoder = buildAmazonLocationMaplibreGeocoder(client, {
    enableAll: true,
    placesIndex: placeIndex,
  });
  ```
+ `getPlacesGeocoder`

  Gibt ein ready-to-use IControl Objekt zurück, das direkt zu einer Map hinzugefügt werden kann.

  ```
  const geocoder = getPlacesGeocoder();
  
  // Initialize map see: <insert link to initializing a map instance here>
  let map = await initializeMap();
  
  // Add the geocoder to the map.
  map.addControl(geocoder);
  ```