Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

# Utiliser le plugin Amazon Location MapLibre Geocoder GL
<a name="dev-maplibre-geocoder"></a>

Le plugin de MapLibre géocodeur Amazon Location est conçu pour vous permettre d'intégrer plus facilement les fonctionnalités Amazon Location dans vos JavaScript applications lorsque vous travaillez sur le rendu de cartes et le géocodage à l'aide de la [maplibre-gl-geocoder](https://github.com/maplibre/maplibre-gl-geocoder)bibliothèque.

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

Installez le plugin de MapLibre géocodeur Amazon Location de NPM pour une utilisation avec les modules. Tapez cette commande :

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

Vous pouvez également importer des fichiers HTML et CSS pour les utiliser directement dans le navigateur à l'aide d'un script :

```
<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"
/>
```

## Utilisation avec le module - SDK autonome GeoPlaces
<a name="geocoder-module"></a>

Cet exemple utilise le [AWS SDK pour JavaScript V3 pour](https://github.com/aws/aws-sdk-js-v3) obtenir un à fournir GeoPlacesClient à la bibliothèque et [AuthHelper](https://github.com/aws-geospatial/amazon-location-utilities-auth-helper-js)pour authentifier le. GeoPlacesClient Il active tout APIs pour le géocodeur.

```
// 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());
```

## Utilisation avec un navigateur - SDK autonome GeoPlaces
<a name="geocoder-browser"></a>

Cet exemple utilise le client Amazon Location pour effectuer une demande authentifiée à l'aide d'une clé d'API.

**Note**  
Certains de ces exemples utilisent l'emplacement Amazon GeoPlacesClient. Ce client est basé sur le [AWS SDK pour JavaScript V3](https://github.com/aws/aws-sdk-js-v3) et permet de passer des appels à Amazon Location via un script référencé dans un fichier HTML.

Incluez les éléments suivants dans un fichier HTML :

```
<!-- 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>
```

Incluez les éléments suivants dans un JavaScript fichier :

```
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());
```

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

Les fonctions utilisées dans le plug-in de MapLibre géocodeur Amazon Location sont répertoriées ci-dessous :
+ `buildAmazonLocationMaplibreGeocoder`

  Cette classe crée une instance de`AmazonLocationMaplibreGeocder`, qui est le point d'entrée de tous les autres appels.

  À l'aide d'appels `GeoPlacesClient` d'API autonomes (le client est une instance de`GeoPlacesClient`) :

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

  À l'aide `LocationClient` d'appels d'API consolidés (le client est une instance de`LocationClient`) :

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

  Renvoie un ready-to-use IControl objet qui peut être ajouté directement à une carte.

  ```
  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);
  ```