リソースの作成認証を設定するの作成 HTML マップの追加検索の追加最終アプリケーション次のステップ

ウェブアプリケーションの作成

このセクションでは、地図と特定の場所での検索機能を備えた静的ページを作成します。まず、Amazon Location リソースを作成し、アプリケーションの APIキーを作成します。

トピック

アプリ用の Amazon Location リソースを作成する
アプリケーションの認証の設定
アプリケーションの HTML の作成
アプリケーションにインタラクティブマップを追加
アプリケーションに検索を追加する
最終のアプリケーションを表示する
次のステップ

アプリ用の Amazon Location リソースを作成する

まだ持っていない場合は、アプリケーションが利用される Amazon Location リソースを作成する必要があります。ここでは、アプリケーションで地図を表示するためのマップリソースと、地図上の場所を検索するためのプレースインデックスを作成します。

位置情報リソースをアプリケーションに追加

使用するマップスタイルを選択します。
1. Amazon Location コンソールのマップページで、[マップを作成] を選択してマップスタイルをプレビューします。
2. 新しいマップリソースの [名前] と [説明] を追加します。マップリソースに使用する名前をメモしておきます。チュートリアルの後半でスクリプトファイルを作成するときに必要になります。
3. マップを選択します。
  
  注記
  マップスタイルを選択すると、利用するマップデータプロバイダーも選択されます。アプリケーションが配送車両や従業員など、ビジネスで使用するアセットを追跡またはルーティングする場合は、位置情報プロバイダーHEREとしてのみを使用できます。詳細については、「AWS サービス規約」のセクション 82 を参照してください。
4. Amazon Location の利用規約に同意し、[マップを作成] を選択します。選択したマップを、拡大、縮小、または任意の方向への画面移動をすることができます。
5. 新しいマップリソースに表示される Amazon リソースネーム (ARN) を書き留めます。チュートリアルの後半で、これを使って正しい認証を作成します。
使用するプレースインデックスを選択します。
1. Amazon Location コンソールの［プレースインデックス」ページで、「プレイスーンデックスを作成」を選択します。
2. 新しいプレースインデックスリソースの名前と説明を追加します。プレースインデックスリソースに入力した名前をメモしておきます。チュートリアルの後半でスクリプトファイルを作成するときに必要になります。
3. データプロバイダーを選択します。
  
  注記
  ほぼすべてのケースでは、すでに選択したマッププロバイダーと一致するデータプロバイダーを選択します。これにより、検索が地図と一致するようになります。
  アプリケーションが配送車両や従業員など、ビジネスで使用するアセットを追跡またはルーティングする場合は、位置情報プロバイダーHEREとしてのみを使用できます。詳細については、「AWS サービス規約」のセクション 82 を参照してください。
4. [データストレージオプション] を選択します。このチュートリアルでは結果は保存されないため、いいえ、1 回のみを選択することができます。
5. Amazon Location の利用規約に同意し、[プレースインデックスを作成] を選択します。
6. 新しい場所インデックスリソースARNに表示されるを書き留めます。このチュートリアルの次のセクションで、これを使って正しい認証を作成します。

アプリケーションの認証の設定

このチュートリアルで作成したアプリケーションは匿名で使用できます。つまり、ユーザーはアプリケーション AWS を使用するためにサインインする必要はありません。ただし、デフォルトでは、Amazon Location Service を使用するには認証APIsが必要です。Amazon Cognito または APIキーのいずれかを使用して、匿名ユーザーに認証と承認を提供できます。このチュートリアルでは、サンプルアプリケーションで使用するAPIキーを作成します。

注記

Amazon Location Service でAPIキーまたは Amazon Cognito を使用する方法の詳細については、「」を参照してくださいAmazon Location Service へのアクセスを許可する。

アプリケーションの認証を設定するには

Amazon Location コンソールに移動し、左側のメニューからAPIキーを選択します。
[API キーの作成] を選択します。

重要
作成するAPIキーは、前のセクションで作成した Amazon Location Service リソースと同じ AWS アカウントおよび AWS リージョンに存在する必要があります。
API キーの作成ページの 1 つで、次の情報を入力します。
- 名前 – など、APIキーの名前MyWebAppKey。
- リソース — 前のセクションで作成した Amazon Location Map リソースとプレースインデックスリソースを選択します。リソースの追加を選択すると、複数のリソースを追加できます。これにより、APIキーをそれらのリソースで使用できます。
- アクション – このAPIキーで承認するアクションを指定します。チュートリアルが期待どおりに動作するように、少なくとも geo:GetMap* と geo:SearchPlaceIndexfForPosition を選択する必要があります。
- オプションで、説明、有効期限 、またはタグをAPIキーに追加できます。また、特定のドメインからのみ使用されるキーに制限するために、リファラー (例えば*.example.com) を追加することもできます。つまり、このチュートリアルはそのドメインでのみ動作することになります。
  
  注記
  API キーの使用状況を保護するには、有効期限またはリファラーの両方を設定することをお勧めします。
API キーの作成 を選択してAPIキーを作成します。
API キーを表示 を選択し、チュートリアルの後半で使用するキー値をコピーします。これは v1.public.a1b2c3d4... 形式です。

重要
このキーは、このチュートリアルの後半でアプリケーションのコードを書くときに必要になります。

アプリケーションの HTML の作成

このチュートリアルでは、マップを埋め込む静的HTMLページを作成し、ユーザーがマップ上の場所にあるものを見つけられるようにします。アプリは 3 つのファイルで構成されます。1 つはウェブページCSS用のHTMLファイル、もう 1 つはマップを作成し、ユーザーのインタラクションとマップイベントに応答するコード用の JavaScript (.js) ファイルです。

まず、アプリケーションに使用される HTMLおよび CSSフレームワークを作成しましょう。これは、マップコンテナを保持する <div> 要素と、クエリへのJSONレスポンスを表示する <pre> 要素を含むシンプルなページになります。

HTML クイックスタートアプリケーションのを作成するには

quickstart.html という名前の新しいファイルを作成します。
テキストエディタまたは任意の環境でファイルを編集します。ファイルに以下を追加しますHTML。
```
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Quick start tutorial</title>

    
    <link href="main.css" rel="stylesheet" />
  </head>
  
  <body>
    <header>
      <h1>Quick start tutorial</h1>
    </header>
    <main>
      <div id="map"></div>
      <aside>
        <h2>JSON Response</h2>
        <pre id="response"></pre>
      </aside>
    </main>
    <footer>This is a simple Amazon Location Service app. Pan and zoom. Click to see details about entities close to a point.</footer>
    
  </body>
</html>
```
HTML これには、次のステップで作成するCSSファイルへのポインタ、アプリケーションのプレースホルダー要素、説明テキストが含まれます。

このチュートリアルで後ほど実行する 2 つのプレースホルダー要素があります。1 つ目はマップコントロールを保持する <div id="map> エレメントです。2 つ目は <pre id="response"> エレメントで、マップ上の検索結果を表示します。
ファイルを保存します。

次に、ウェブページCSSにを追加します。これにより、アプリケーションのテキストとプレースホルダー要素のスタイルが設定されます。

CSS クイックスタートアプリケーションのを作成するには

main.cssという新しいファイルを、前の手順で作成した quickstart.html ファイルと同じフォルダに作成します。

ご使用されたいエディタでファイルを編集します。以下のテキストをファイルに追加します。


* {
  box-sizing: border-box;
  font-family: Arial, Helvetica, sans-serif;
}

body {
  margin: 0;
}

header {
  background: #000000;
  padding: 0.5rem;
}

h1 {
  margin: 0;
  text-align: center;
  font-size: 1.5rem;
  color: #ffffff;
}

main {
  display: flex;
  min-height: calc(100vh - 94px);
}

#map {
  flex: 1;
}

aside {
  overflow-y: auto;
  flex: 0 0 30%;
  max-height: calc(100vh - 94px);
  box-shadow: 0 1px 1px 0 #001c244d, 1px 1px 1px 0 #001c2426, -1px 1px 1px 0 #001c2426;
  background: #f9f9f9;
  padding: 1rem;
}

h2 {
  margin: 0;
}

pre {
  white-space: pre-wrap;
  font-family: monospace;
  color: #16191f;
}

footer {
  background: #000000;
  padding: 1rem;
  color: #ffffff;
}

これにより、他のユーザーが使用していないスペースを埋めるようにマップが設定され、回答用の領域がアプリの幅の 30% を占めるように設定され、タイトルと説明テキストの色とスタイルが設定されます。

ファイルを保存します。
これで、quickstart.htmlファイルをブラウザで表示して、アプリケーションのレイアウトを確認できるようになります。

次に、アプリケーションにマップコントロールを追加します。

アプリケーションにインタラクティブマップを追加

フレームワークと div プレースホルダーができたので、マップコントロールをアプリケーションに追加できます。このチュートリアルでは、マップコントロールとして MapLibre GL JS を使用し、Amazon Location Service からデータを取得します。また、を使用してJavaScript 認証ヘルパー、 APIキーAPIsを使用して Amazon Location への呼び出しの署名を容易にします。

インタラクティブマップをアプリケーションに追加

前のセクションで作成したquickstart.htmlファイルを開きます。
必要なライブラリへの参照と、これから作成するスクリプトファイルを追加します。必要な変更はgreenに示されています。
```
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Quick start tutorial</title>

    
    <link href="https://unpkg.com/maplibre-gl@3.x/dist/maplibre-gl.css" rel="stylesheet" />
    <link href="main.css" rel="stylesheet" />
  </head>
  
  <body>
    ...
    <footer>This is a simple Amazon Location Service app. Pan and zoom. Click to see details about entities close to a point.</footer>
    
    
    <script src="https://unpkg.com/maplibre-gl@3.x/dist/maplibre-gl.js"></script>
    <script src="https://unpkg.com/@aws/amazon-location-client@1.x/dist/amazonLocationClient.js"></script>
    <script src="https://unpkg.com/@aws/amazon-location-utilities-auth-helper@1.x/dist/amazonLocationAuthHelper.js"></script>
    
    
    <script src="main.js"></script>
  </body>
</html>
```
アプリケーションに次の依存関係が追加されます。
- MapLibre GL JS 。このライブラリとスタイルシートには、マップタイルを表示し、パンやズームなどのインタラクティブ機能を含むマップコントロールが含まれています。このコントロールでは、地図上に独自の特徴を描くなどの機能拡張も可能です。
- Amazon Location クライアント。これにより、地図データを取得したり、地図上の場所を検索したりするために必要な Amazon Location 機能のインターフェイスが提供されます。Amazon Location クライアントは、 AWS SDK for JavaScript v3 に基づいています。
- Amazon Location 認証ヘルパー。これにより、 APIキーまたは Amazon Cognito を使用して Amazon Location Service を認証するのに役立つ関数が提供されます。
このステップでは、次に作成するmain.jsへの参照先も追加されます。
quickstart.html ファイルを保存します。
HTML およびファイルと同じフォルダmain.jsにという名前の新しいCSSファイルを作成し、編集用に開きます。
次のスクリプトをファイルに追加します。のテキスト red は、以前に作成したAPIキー値、マップリソース名、場所リソース名、リージョンのリージョン識別子 ( など) に置き換える必要がありますus-east-1。
```
// Amazon Location Service resource names:
const mapName = "explore.map";
const placesName = "explore.place";
const region = "your_region";
const apiKey = "v1.public.a1b2c3d4...

// Initialize a map
async function initializeMap() {
  const mlglMap = new maplibregl.Map({
    container: "map", // HTML element ID of map element
    center: [-77.03674, 38.891602], // Initial map centerpoint
    zoom: 16, // Initial map zoom
    style: `https://maps.geo.${region}.amazonaws.com/maps/v0/maps/${mapName}/style-descriptor?key=${apiKey}`, // Defines the appearance of the map and authenticates using an API key
  });

  // Add navigation control to the top left of the map
  mlglMap.addControl(new maplibregl.NavigationControl(), "top-left");
  
  return mlglMap;
}

async function main() {
  // Initialize map and Amazon Location SDK client:
  const map = await initializeMap();
}

main();
```
このコードは Amazon Location リソースをセットアップし、 MapLibre GL JS マップコントロールを設定および初期化し、ID を持つ <div>要素に配置しますmap。

initializeMap()関数を理解することは重要です。これにより、アプリケーションで MapLibre マップをレンダリングするために使用される新しいマップコントロール (mlglMapローカルmapで呼び出されますが、コードの残りの部分で呼び出されます) が作成されます。
```
  // Initialize the map
  const mlglMap = new maplibregl.Map({
    container: "map", // HTML element ID of map element
    center: [-77.03674, 38.891602], // Initial map centerpoint
    zoom: 16, // Initial map zoom
    style: `https://maps.geo.${region}.amazonaws.com/maps/v0/maps/${mapName}/style-descriptor?key=${apiKey}`, // Defines the appearance of the map and authenticates using an API key
  });
```
新しい MapLibre マップコントロールを作成すると、渡すパラメータはマップコントロールの初期状態を示します。ここで以下のパラメータを設定します。
- HTML コンテナ。の map div 要素を使用しますHTML。
- ワシントン DC のある地点までのマップは初期中心。
- 16 へのズームレベル (近隣やブロックレベルに拡大)。
- マップに使用するスタイル。マップタイルやマップをレンダリング MapLibre URLするためのその他の情報を取得するためにが使用するスタイルです。これには認証用の APIキーURLが含まれていることに注意してください。
JavaScript ファイルを保存し、ブラウザで開きます。これで、ページ上にマップが作成され、画面移動やズーム操作を実行できるようになりました。

注記
このアプリを使用して、 MapLibre マップコントロールの動作を確認できます。Ctrl または Shift キーを押しながらドラッグ操作を試してみると、マップを操作する他の方法を確認できます。この機能はすべてカスタマイズ可能です。

アプリの設置はほぼ完成しました。次のセクションでは、マップ上の場所を選択し、選択した場所の住所を表示します。また、JSONページに結果が表示され、完全な結果が表示されます。

アプリケーションに検索を追加する

アプリケーションの最後のステップは、マップに検索を追加することです。この場合は、ある場所にあるアイテムを検索するリバースジオコーディング検索を追加します。

注記

Amazon Location Service では、名前または住所で検索して、地図上の場所の位置を検索することもできます。

アプリケーションに検索機能の追加

前のセクションで作成したmain.jsファイルを開きます。

図のようにmain関数を変更します。必要な変更はgreenに示されています。


async function main() {
  // Create an authentication helper instance using an API key
  const authHelper = await amazonLocationAuthHelper.withAPIKey(apiKey);


  // Initialize map and Amazon Location SDK client:
  const map = await initializeMap();

  const client = new amazonLocationClient.LocationClient({
    region,
    ...authHelper.getLocationClientConfig(), // Provides configuration required to make requests to Amazon Location
  });


  // On mouse click, display marker and get results:
  map.on("click", async function (e) {
    // Set up parameters for search call
    let params = {
      IndexName: placesName,
      Position: [e.lngLat.lng, e.lngLat.lat],
      Language: "en",
      MaxResults: "5",
    };

    // Set up command to search for results around clicked point
    const searchCommand = new amazonLocationClient.SearchPlaceIndexForPositionCommand(params);

    try {
      // Make request to search for results around clicked point
      const data = await client.send(searchCommand);

      // Write JSON response data to HTML
      document.querySelector("#response").textContent = JSON.stringify(data, undefined, 2);

      // Display place label in an alert box
      alert(data.Results[0].Place.Label);
    } catch (error) {
      // Write JSON response error to HTML
      document.querySelector("#response").textContent = JSON.stringify(error, undefined, 2);

      // Display error in an alert box
      alert("There was an error searching.");
    }
  });
}

このコードは、APIキーを使用するように Amazon Location 認証ヘルパーを設定することから始めます。


const authHelper = await amazonLocationAuthHelper.withAPIKey(apiKey);

次に、その認証ヘルパーと、使用しているリージョンを使って新しい Amazon Location クライアントを作成します。


const client = new amazonLocationClient.LocationClient({
    region,
    ...authHelper.getLocationClientConfig(),
  });

次に、ユーザーがマップ・コントロール上のスポットを選択すると、コードはそれに応答する。これは、に MapLibre 提供されたイベントをキャッチすることによって行われますclick。


map.on("click", async function(e) {
    ...
  });

イベントは MapLibre click、ユーザーが選択した緯度と経度 () を含むパラメータを提供しますe.lngLat。clickイベント内では、コードによってがsearchPlaceIndexForPositionCommand作成され、指定した緯度と経度にあるエンティティが検索されます。


    // Set up parameters for search call
    let params = {
      IndexName: placesName,
      Position: [e.lngLat.lng, e.lngLat.lat],
      Language: "en",
      MaxResults: "5"
    };

    // Set up command to search for results around clicked point
    const searchCommand = new amazonLocationClient.SearchPlaceIndexForPositionCommand(params);

    try {
      // Make request to search for results around clicked point
      const data = await client.send(searchCommand);
      ...
    });

ここで、IndexName は先に作成したプレースインデックスリソースの名前、Position は Language を検索するための緯度と経度、Y は結果の優先言語、そして MaxResults は最大 5 つの結果のみを返すように Amazon Location に指示します。

残りのコードはエラーをチェックし、検索結果をresponseという<pre>要素に表示し、一番上の結果をアラートボックスに表示する。

(オプション) ここでquickstart.htmlファイルを保存してブラウザで開くと、マップ上の場所を選択すると、選択した場所の名前または住所が表示されます。

アプリケーションの最後のステップでは、 MapLibre 機能を使用して、ユーザーが選択した場所にマーカーを追加します。main 関数を次のように変更します。必要な変更はgreenに示されています。


async function main() {
  // Create an authentication helper instance using an API key
  const authHelper = await amazonLocationAuthHelper.withAPIKey(apiKey);

  // Initialize map and Amazon Location SDK client
  const map = await initializeMap();
  const client = new amazonLocationClient.LocationClient({
    region,
    ...authHelper.getLocationClientConfig(), // Provides configuration required to make requests to Amazon Location
  });

  // Variable to hold marker that will be rendered on click
  let marker;

  // On mouse click, display marker and get results:
  map.on("click", async function (e) {
    // Remove any existing marker
    if (marker) {
      marker.remove();
    }

    // Render a marker on clicked point
    marker = new maplibregl.Marker().setLngLat([e.lngLat.lng, e.lngLat.lat]).addTo(map);

    // Set up parameters for search call
    let params = {
      IndexName: placesName,
      Position: [e.lngLat.lng, e.lngLat.lat],
      Language: "en",
      MaxResults: "5",
    };

    // Set up command to search for results around clicked point
    const searchCommand = new amazonLocationClient.SearchPlaceIndexForPositionCommand(params);

...

このコードでは marker 変数を宣言しており、ユーザーが場所を選択するたびに、選択した場所を示す Z 変数が入力される。.addTo(map);でマップに追加されると、メーカーはマップコントロールによって自動的にレンダリングされる。また、このコードは以前のメーカーをチェックして削除し、画面には一度に 1 つのマーカーしか表示されないようにします。

main.js ファイルを保存し、ブラウザで quickstart.html ファイルを開きます。以前と同様にマップ上で画面移動や拡大を行うことができますが、場所を選択すると、選択した場所の詳細が表示されるようになりました。

これでクイックスタートアプリケーションが完成しました。このチュートリアルでは、以下の静的HTMLアプリケーションを作成する方法を示します。

ユーザーが操作できるマップを作成します。
マップイベント click を処理します。
Amazon Location Service を呼び出します。具体的にはAPI、を使用して、ある場所でマップを検索しますsearchPlaceIndexForPosition。
MapLibre マップコントロールを使用してマーカーを追加します。

最終のアプリケーションを表示する

このアプリケーションの最終的なソースコードはこのセクションに含まれています。最終プロジェクトはでも GitHub確認できます。

の GitHubAPIキーの代わりに Amazon Cognito を使用するアプリケーションのバージョンを見つけることもできます。

Overview

各タブを選択すると、このクイックスタートチュートリアルのファイルの最終的なソースコードが表示されます。

ファイルは以下のとおりです。

quickstart.html — マップと検索結果のHTML要素ホルダーを含む、アプリケーションのフレームワーク。
main.css — アプリケーションのスタイルシート。
main.js — ユーザーを認証し、マップを作成し、イベントを検索するアプリケーション用のスクリプト。click

quickstart.html

クイックスタートアプリケーションのHTMLフレームワーク。


<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Quick start tutorial</title>

    <!-- Styles -->
    <link href="https://unpkg.com/maplibre-gl@3.x/dist/maplibre-gl.css" rel="stylesheet" />
    <link href="main.css" rel="stylesheet" />
  </head>
  
  <body>
    ...
    <footer>This is a simple Amazon Location Service app. Pan and zoom. Click to see details about entities close to a point.</footer>
    
    <!-- JavaScript dependencies -->
    <script src="https://unpkg.com/maplibre-gl@3.x/dist/maplibre-gl.js"></script>
    <script src="https://unpkg.com/@aws/amazon-location-client@1.x/dist/amazonLocationClient.js"></script>
    <script src="https://unpkg.com/@aws/amazon-location-utilities-auth-helper@1.x/dist/amazonLocationAuthHelper.js"></script>
    
    <!-- JavaScript for the app -->
    <script src="main.js"></script>
  </body>
</html>

main.css

クイックスタートアプリケーションのスタイルシート。


* {
  box-sizing: border-box;
  font-family: Arial, Helvetica, sans-serif;
}

body {
  margin: 0;
}

header {
  background: #000000;
  padding: 0.5rem;
}

h1 {
  margin: 0;
  text-align: center;
  font-size: 1.5rem;
  color: #ffffff;
}

main {
  display: flex;
  min-height: calc(100vh - 94px);
}

#map {
  flex: 1;
}

aside {
  overflow-y: auto;
  flex: 0 0 30%;
  max-height: calc(100vh - 94px);
  box-shadow: 0 1px 1px 0 #001c244d, 1px 1px 1px 0 #001c2426, -1px 1px 1px 0 #001c2426;
  background: #f9f9f9;
  padding: 1rem;
}

h2 {
  margin: 0;
}

pre {
  white-space: pre-wrap;
  font-family: monospace;
  color: #16191f;
}

footer {
  background: #000000;
  padding: 1rem;
  color: #ffffff;
}

main.js

クイックスタートアプリケーションのコード。のテキスト red は、適切な Amazon Location オブジェクト名に置き換える必要があります。


// Amazon Location Service resource names:
const mapName = "explore.map";
const placesName = "explore.place";
const region = "your_region";
const apiKey = "v1.public.a1b2c3d4...

// Initialize a map
async function initializeMap() {
  // Initialize the map
  const mlglMap = new maplibregl.Map({
    container: "map", // HTML element ID of map element
    center: [-77.03674, 38.891602], // Initial map centerpoint
    zoom: 16, // Initial map zoom
    style: `https://maps.geo.${region}.amazonaws.com/maps/v0/maps/${mapName}/style-descriptor?key=${apiKey}`, // Defines the appearance of the map and authenticates using an API key
  });

  // Add navigation control to the top left of the map
  mlglMap.addControl(new maplibregl.NavigationControl(), "top-left");

  return mlglMap;
}

async function main() {
  // Create an authentication helper instance using an API key
  const authHelper = await amazonLocationAuthHelper.withAPIKey(apiKey);

  // Initialize map and Amazon Location SDK client
  const map = await initializeMap();
  const client = new amazonLocationClient.LocationClient({
    region,
    ...authHelper.getLocationClientConfig(), // Provides configuration required to make requests to Amazon Location
  });

  // Variable to hold marker that will be rendered on click
  let marker;

  // On mouse click, display marker and get results:
  map.on("click", async function (e) {
    // Remove any existing marker
    if (marker) {
      marker.remove();
    }

    // Render a marker on clicked point
    marker = new maplibregl.Marker().setLngLat([e.lngLat.lng, e.lngLat.lat]).addTo(map);

    // Set up parameters for search call
    let params = {
      IndexName: placesName,
      Position: [e.lngLat.lng, e.lngLat.lat],
      Language: "en",
      MaxResults: "5",
    };

    // Set up command to search for results around clicked point
    const searchCommand = new amazonLocationClient.SearchPlaceIndexForPositionCommand(params);

    try {
      // Make request to search for results around clicked point
      const data = await client.send(searchCommand);

      // Write JSON response data to HTML
      document.querySelector("#response").textContent = JSON.stringify(data, undefined, 2);

      // Display place label in an alert box
      alert(data.Results[0].Place.Label);
    } catch (error) {
      // Write JSON response error to HTML
      document.querySelector("#response").textContent = JSON.stringify(error, undefined, 2);

      // Display error in an alert box
      alert("There was an error searching.");
    }
  });
}

main();

次のステップ

クイックスタートチュートリアルを完了したので、Amazon Location Service を使用してアプリケーションを構築する方法を理解できるでしょう。Amazon Location をさらに活用するには、以下のリソースをご覧ください。

Amazon Location Service の概念をより深く知る
Amazon Location の特徴や機能の使用方法に関する詳細情報はこちら
Amazon Location を使用したコード例を見て、このサンプルを発展させて、より複雑なアプリケーションを構築する方法はこちら

ブラウザで JavaScript が無効になっているか、使用できません。

AWS ドキュメントを使用するには、JavaScript を有効にする必要があります。手順については、使用するブラウザのヘルプページを参照してください。

ドキュメントの表記規則

クイックスタート

Android アプリを作成する