ArcGIS Location Platform を簡単に

Jan Tschada

ArcGIS Location Platform は、開発者向けに強力なロケーションサービス（地図表示、ルーティング、ジオコーディング、Places 検索など）を革新的なウェブアプリケーションに直接統合するための当社の提供サービスです。本記事では、Esri Inc. の公式GitHub デモリポジトリを詳しく見ていき、各機能が技術的にどのように実装され、効果的に連携しているかを解説します。<\/P>

このアプリケーションは HTML と JavaScript をベースにしており、当社のArcGIS Maps SDK for JavaScriptを利用しています。中心となるファイル <\/SPAN>main.js<\/FONT> <\/SPAN>には、地図の初期化、データ統合、およびロケーションサービスとのインタラクションに関するすべてのロジックが含まれています。<\/P>アプリケーション起動時には、選択可能なベースマップを持つ地図が読み込まれます。これは、希望する地図タイプで <\/SPAN>Map オブジェクトを初期化することで実現されます。以下のコード例ではナビゲーションに最適化されたベースマップを使用しています：<\/P>const map = new Map({
basemap: "arcgis/navigation"
});<\/code><\/pre> <\/P>次に、HTML コンテナ内で地図をレンダリングする <\/SPAN>MapView<\/FONT> <\/SPAN>が作成されます。この際、開始位置はパームスプリングスに設定されます：<\/SPAN><\/P>const view = new MapView({
container: "viewDiv",
map: map,
center: [-116.5453, 33.8303],
zoom: 13
});<\/code><\/pre> <\/P>デモの中心的な機能の一つは、CSV ファイルからポイント・オブ・インタレスト（POI）を読み込むことです。このファイルは事前にフィーチャーサービスにアップロードされています。以下のコードは、このサービスを <\/SPAN>FeatureLayer<\/FONT> <\/SPAN>として組み込む方法を示しています：<\/SPAN><\/P>const featureLayer = new FeatureLayer({
url: "https://services.arcgis.com/026/FeatureServer/0",
popupTemplate: {
title: "{Name}",
content: "{Description}"
},
renderer: {
type: "unique-value",
field: "Type",
uniqueValueInfos: [...]
}
});
map.add(featureLayer);<\/code><\/pre> <\/P>popupTemplate<\/FONT> プロパティはオブジェクトクリック時に表示される情報を定義し、renderer<\/FONT> は異なるタイプの POI を異なる表示で表現します。<\/SPAN><\/P>ルート計算には RouteTask<\/FONT> が使われ、開始点と目的地が渡されます。計算成功後、ルートは Graphic<\/FONT> として地図上に表示されます：<\/P>route.solve(routeParams).then(function(data) {
const routeResult = data.routeResults[0].route;
routeLayer.add(new Graphic({
geometry: routeResult.geometry,
symbol: routeSymbol
}));
});<\/code><\/pre> <\/P>routeParams<\/FONT> には開始点と目的地のジオメトリや交通情報などのオプション設定が含まれています。<\/P>また、このアプリケーションでは当社のArcGIS Living Atlas of the Worldから交通データの表示・非表示を切り替えることも可能です。これはシンプルな可視性スイッチで制御されます：<\/P>trafficLayer.visible = !trafficLayer.visible;<\/code><\/pre> <\/P>ArcGIS Location Platform は特定地点の標高情報も取得できます。これには当社のElevation-Serviceが使われ、その地点の Z 座標（標高）を返します：<\/SPAN><\/P>elevationLayer.queryElevation(point).then(function(result) {
console.log("Elevation:", result.geometry.z);
});<\/code><\/pre> <\/P>この機能は標高情報を含む特定のベースマップでのみ動作する点に注意が必要です。<\/P>最後に、このアプリケーションは当社のPlaces-Serviceへのアクセスも提供し、特定カテゴリの近隣スポット検索が可能です。以下の例では地図中心付近でカフェや博物館などを検索しています：<\/P>placesService.searchNearby({
location: view.center,
categories: ["Coffee shop", "Museum"],
maxResults: 10
}).then(showResults);<\/code><\/pre> <\/P>ArcGIS Location Platform を使う際にはいくつか注意点があります。例えば、有効な API キーを secret.js<\/FONT> に作成しないと対応するロケーションサービスが利用できません。また、自身で用意した CSV ファイルが UTF-8 エンコードでない場合や特殊文字が含まれる場合には問題が生じることがあります。さらに交通データは特定ベースマップでのみ機能するため設定時に考慮すべきです。<\/P>ArcGIS Location Platform はわずかなコード行数でモダンなウェブアプリケーションへ多彩な機能を統合できる強力なツールです。ルーティングや Places 検索、交通データ表示など、地理情報を活用したいすべての方に最適です。<\/P>もしご自身で当社ロケーションサービスを使ったアプリ開発をご検討ならば、公式デモリポジトリをフォークして独自ユースケースで試すことをお勧めします。ドキュメントは明確に構成されており、サンプルも簡単にカスタマイズ可能です。<\/P>ぜひ当社のDeveloper Hubもご覧ください。<\/P>