Leaflet.js で交通ネットワークを使った高度な解析をしてみよう - Esri Leaflet Tips

Document created by yusuke_nunokawaesrij-esridist Employee on Mar 24, 2017Last modified by yusuke_nunokawaesrij-esridist Employee on Apr 3, 2017
Version 1Show Document
  • View in full screen mode

交通ネットワークを使った解析にはいくつか種類があります。

 

  • ルート案内
  • 最寄り施設の検索
  • 到達圏
  • 配車ルート(VRP: Vehicle Routing Problem)

  など

 

今回は「到達圏」を Leaflet.js から利用してみます。

到達圏とは、任意の地点から交通ネットワーク上で一定の時間内に到達可能なエリアのことです。

ArcGIS のクラウドでは到達圏の解析処理を Web サービス (REST) として利用できるので、エンジニアであればすぐにアクセスできます。

 

 

今まで紹介した住所検索や属性/空間検索といった機能はほぼ使い放題なのですが、到達圏解析はやや高度な分析処理となるため、月ごとの使用回数に上限があります。

ArcGIS for Developers では毎月クレジットが配布され、このクレジットを消費してサービスを利用します。

クレジットに関する説明は「クレジット | ArcGIS for Developers - ESRIジャパン」をご覧ください。

 

 

到達圏の使いどころ

 

到達圏はあまり見慣れない図形かもしれません。

しかし、現在地から自動車で 10 分以内で到着できる範囲にある店舗を検索するといった機能は割と一般的なものだと思います。

下の画像はクリックした地点から徒歩で 10 分圏内にある無料公衆無線LANスポットを表示しています。

フリーランスのエンジニアや訪日外国人旅行者などに重宝しそうですね。

 

 

これを ArcGIS で実現するとしたらフローはこんな感じです。

 

  1. ArcGIS に到達圏作成をリクエスト
  2. ArcGIS が到達圏を算出
  3. 取得した到達圏を入力値とした店舗データの空間検索リクエストを作成/送信
  4. 結果を地図に表示

 

主な GIS の機能としては到達圏解析と空間検索ですが、どちらも ArcGIS で API 提供されているので、それらを組み合わせることで実現ができます。

空間検索については前々回の記事(『Leaflet.js で空間フィルタリングをやってみる』)を参考にしてください。

 

 

Leaflet.js で ArcGIS の解析サービスを実行

 

 

今回のサンプルは ArcGIS for Developers アカウントをお持ちであれば、ログインしてお試しいただけます。

 

 

アカウントは無償ですぐに作れるのでぜひ。

無償アカウントでも月に最大 100 件まで到達圏解析の実行が可能です。

なお、ArcGIS の OAuth 認証の実装についての紹介はまたの機会にしておきます。

 

さて、実装方法の紹介をしていきます。

解析サービスの実行には L.esri.GP.service を使います。

GP とはジオプロセシング(Geoprocessing)の略称で、GIS 解析処理の呼び方だと思ってください。

また、L.esri.GP.service は Esri Leaflet のプラグインなので、別途 CDN の URL を追加します。

 

<!-- Esri Leaflet Geoprocessing CDN -->
<script src="https://cdn.jsdelivr.net/leaflet.esri.gp/2.0.0/esri-leaflet-gp.js"></script>

 

到達圏解析のサービス(logistics.arcgis.com)を使って解析サービスの初期化とタスクの作成を行います。

このサービスは非同期タイプの解析サービスなので、asyncInterval で処理が完了しているかを確認する間隔を指定します。

REST API の詳細は以下で確認できます。

 

// 解析サービスの初期化
gpService = L.esri.GP.service({
  url: "https://logistics.arcgis.com/arcgis/rest/services/World/ServiceAreas/GPServer/GenerateServiceAreas",
  token: token,
  asyncInterval: 1
});

// タスクの作成
gpTask = gpService.createTask();
// タスクの入力パラメーター設定 (5 分と 10 分圏内)
gpTask.setParam('break_values', '5 10');
// タスクの出力パラメーター名の設定
gpTask.setOutputParam('Service_Areas');

// 地図をクリックしたら実行
map.on('click', runDriveTimes);

 

実行処理を書きます。

 

// 到達圏解析の実行
function runDriveTimes(evt) {
  // 出発地をクリックした地点の緯度経度に指定
  gpTask.setParam('facilities', evt.latlng);
  // 実行
  gpTask.run(driveTimeCallback);
}

 

解析結果をコールバックで取得します。

取得したデータは GeoJSON なので L.geoJson を使って表示します。

コールバック関数名は先の gpTask.run() の引数に指定したものを使います。

 

// 結果表示用のレイヤー
var driveTimes = L.featureGroup().addTo(map);

// 到達圏解析のコールバック
function driveTimeCallback(error, response, raw){
// 結果(GeoJSON)の表示
var results = L.geoJson(response.Service_Areas, {
   style: function (feature) {
     if (feature.properties.ToBreak === 10) {
       return {color: '#ff6600', fillColor: '#ff6600'};
     } else if (feature.properties.ToBreak === 5) {
       return {color: '#ff0099', fillColor: '#ff0099'};
     }
   }
});
driveTimes.addLayer(results);
}

 

以上が、ArcGIS 解析サービスの実行から結果取得までの流れです。

 

 

住所検索サービスには100万リクエスト/月の上限がございます

 

 

関連リンク

Attachments

    Outcomes