Amazon Web Services ブログ
Amazon Location Service のマップスタイル選択のポイント
Amazon Location Service は、複数のユースケースに対応できるように、9 つの異なるマップスタイルを提供しています。どのようにして、アプリケーションに適したベースマップのスタイルを選択するのでしょうか?また、選択したベースマップは、アプリケーションの他の部分にどのような影響を与えるのでしょうか?この記事では、Amazon Location マップで利用可能なさまざまなマップスタイルと、アプリケーションに最適なマップスタイルを決定する方法について説明します。
Amazon Location マップの表示
Amazon Location は、MapLibre GL JS、Tangram、AWS Amplify JS など、人気のあるオープンソースのマップレンダリングライブラリをサポートしています。ベースマップのタイルを表示する複数の方法を提供することで、既存のベースマッププロバイダやソースから簡単に移行することができます。開発者向けガイドには、掲載されているライブラリの簡単な使い始めのガイドが掲載されており、数分で使い始めることができます。
Amazon Location は、データプロバイダからベクターとラスターの両方のタイルを提供しています。ベクタータイルを使用すると、アプリケーションに合わせてマップのスタイルをさらに変更することができます。GitHub のサンプルリポジトリに、ベースマップのデザイン以外のマップスタイルの編集を始めるのに役立つリソースを用意しています。
サンプルアプリケーションのインストール
Amazon Location マップを表示するための様々な方法について説明しましたが、次にサンプルアプリケーションを見てみましょう。今回は、AWS Cloud9 インスタンスを使用して、インストールコマンドを実行することにします。
前提条件
次の前提条件を満たしていることを確認してから、次に進んでください。
- AWS アカウント
- AWS Identity and Access Management (IAM) ユーザーまたは、AWS Amplify, Amazon Location Service, AWS Lambda, および AWS Cognito にアクセスする権限がある Amazon Elastic Compute Cloud (Amazon EC2)インスタンスプロファイル
- node v 16.x
- npm 8.x
- AWS Amplify CLI
アプリケーションの設定
まず、サンプルアプリケーションを含む GitHub の amazon-location-samples リポジトリをクローンする必要があります。このリポジトリには、Amazon Location を使い始める際に役に立つ様々なサンプルアプリケーションが含まれています。
今回使用するサンプルアプリケーションのディレクトリに移動します。
依存関係をインストールします。
インストールが完了したら、Amplify のプロジェクトの作成を行います。
Amplify のプロジェクトを作成する際の選択肢は以下のように選択します。
認証方法については、Amplify CLI のインストールを参照してください。Amplify の環境を初期化したら、クラウドリソースを作成します。すべてのリソースを完全にデプロイするために数分かかる場合があります。
続けるかどうか尋ねられたら、”Y “を選択してください。
デプロイが完了するのを待ちます。AWS クラウドにリソースが作成されたら、アプリをローカルでホスティングするか、フロントエンドを AWS Amplify に公開するか、どちらかを選択します。ローカルでホスティングする場合は、以下のコマンドを実行します。
以下は、AWS Cloud9 のローカルでサンプルアプリケーションを起動した例です。

AWS Cloud9 のローカルでサンプルアプリケーションを起動した例
Amplify Hosting を利用する場合は、publish コマンドを実行します。Amplify Hosting については、Amplify Hosting Overview を参照してください。

Amplify のデプロイ完了
表示された URL を Web ブラウザで開いてください。。マップスタイルを比較するためのアプリケーションの準備が整いました。この URL は、組織内で共有して利用できます。
アプリケーションを使う
Amplify でアプリケーションが動作するようになったので、マップスタイルをいくつかロードしてみます。このアプリケーションでは、マップのピッチを変えることで 3D スタイルを利用したり、比較したい地点を探すための検索バーを利用したりすることができます。次に、いくつかの例を挙げて、なぜこのスタイルが選ばれるのかを見てみましょう。
ライトマップとダークマップ
VectorEsriDarkGreyCanvas と VectorEsriLightGreyCanvas という 2 つの Esri スタイルを使用したこの例では、両方のマップを使用し、アプリケーション内でダークモードとライトモードの切り替えを行うことが望ましい場合があることが分かります。マップに表示される情報は同じですが、色は異なります。GitHub の amazon-location-samples リポジトリに、マップスタイルを切り替えるサンプルアプリケーションがあります。

Esri Light and Esri Dark の比較
マップの正確さ
もう一つのユースケースは、どちらのマップがより新しいかということです。Amazon Location は2 つのデータプロバイダを使用しているため、機能によって微妙な違いがある場合があります。この例では、Esri Navigation のスタイルと Here Explore のスタイルを比較しています。表示されている高速道路のインターチェンジは 2022 年 6 月に完成しており、Here では更新された構成が表示されていますが、Esri ではまだ更新されていません。非常に正確なデータを必要とするアプリケーションでは、あるプロバイダまたはスタイルが特定の領域でより最新で正確な表現を提供することがわかるかもしれません。

Esri Navigation と Here Explore の比較
地勢の情報
マップスタイルによって、地勢の情報が異なります。Amazon Location が提供する Esri Vector Topographic は、特にこのようなユースケースに適しています。次の例では、イエローストーン国立公園を Esri Vector Topographic マップ で見ると、山の名前と標高を見ることができます。Esri Navigation マップには、このような情報は含まれていません。アウトドア レクリエーションを中心としたアプリケーションでは、Esri Vector Topographic マップの方が適している場合があります。

Esri Streets と Esri Topographic の比較
公共交通機関
公共交通機関やその他のナビゲーションの補助に焦点を当てたユースケースでは、より適したスタイルがあるかもしれませんこの例では、東京駅周辺を対象に、Esri Navigation スタイルと Here Explore スタイルを比較しています。この場合、Here Explore の方が、路線や駅など公共交通機関の情報が充実しています。

Esri Navigation と Here Explore の比較
トラック輸送と危険物
大型車両を運転する場合、橋の高さや走行制限は非常に重要です。このようなユースケースに対応するアプリケーションを構築する場合、Here Explore Truck マップは最適です。橋の高さや危険物規制道路を表示する Here Explore Truck マップは、大型車の安全な移動に必要な情報を提供します。

Here Explore と Here Explore Truck の比較
衛星写真とストリートマップの比較
最後のユースケースは、ストリートマップと比較した衛星(または航空)ビューです。Esri Raster Imagery タイルを使用すると、航空写真を見ることができます。これは、何かがどこにあるのかを明確にする必要がある精密な位置特定アプリケーションで役立ちます。例えば、駐車場にあるレンタルスクーターの位置は、道路マップでは視認できませんが、航空写真では一目瞭然です。

Here Explore と Esri Raster の比較
後片付け
アプリケーションを削除するには、アプリケーションディレクトリに移動してください。
そして、以下を実行します。
プロンプトが表示されたら “y” を選択します。
まとめと次のステップ
この記事では、オープンソースのマップレンダリングライブラリを使用して、AWS Amplify で Amazon Location マップのスタイルを並べて比較する方法について説明しました。このツールを使用すると、ユースケースに最適なマップを決定し、異なるスタイルで特定のポイントを見ることができます。このサンプルアプリケーションはオープンソースであるため、コードを変更し、マーカーやポリゴン、その他の機能を追加して、異なるマップスタイルでアプリケーションがどのように見えるかをより正確に比較することができます。
この記事は、Considerations when choosing Amazon Location Services Map Styles を翻訳したものです。