2015年4月 更新
Google Maps JavaScript API v3DirectionsService のルート検索したときの検索結果のgoogle.maps.DirectionsResultがどのような情報を格納しているのかを調べました。
以下のページに、実際に検索をして結果を確認するデモを作りました。
デモ画面サンプル

実際に操作してみてください。
以下の表は、この検索操作をして、調べました。

Google Maps API V3

Google Maps API V3 は、google が提供指定している Goog;le Maps を使用するためのAPIです。
Goggle Maps API V3 は、JavaScript で簡単にgoogle の地図を表示したり、ルート検索等操作することができます。
今回は、この中から、ルート検索でどのような情報を所得することができるのかを調べてみました。
Google Maps JavaScript API v3 の導入は、googleのデベロッパーガイドを参照してください。
サンプルのコーディング例もあります。

ルート検索コード

以下のようなコードでルート検索ができます。
詳細は、上記のデモページのソースコード等で確認してください。
var map = new google.maps.Map(document.getElementById("map_canvas"));
var directionsService = new google.maps.DirectionsService(); 
var rendererOptions = {
    draggable: true
};
var directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById('directions-panel'));
directionsService.route(request, function(result, status) { 
    if (status == google.maps.DirectionsStatus.OK) {
        directionsDisplay.setDirections(result);
    }
});
簡単な流れは以下のようになっています。
  1. googl.maps.Map を生成します。
    var map = new google.maps.Map(document.getElementById("map_canvas"));
    		
    • ここで指定した、map_canvas の位置に地図が表示されます。
    • 地図の表示方法は、google maps のサンプル等を参考にしてください。
  2. ルート検索のサービスgooglre.maos.DirectionsServiceを生成して、google maps に結び付けます。
    • ここでは、検索した後のルート経路をを地図上でドラッグして、調整てきるように、rendererOptions で、draggable=trueを指定しています。
      var directionsService = new google.maps.DirectionsService();
      var rendererOptions = {
          draggable: true
      };
      var directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);
      directionsDisplay.setMap(map);
      				
  3. ルート検索の結果の情報をテキストで表示するための、Panelの指定をすると、.ルート検索の情報をテキスト表示できます。
    • 必須ではありません。
      directionsDisplay.setPanel(document.getElementById('directions-panel'));
      				
    • ルート検索結果を以下のようにセットします。
      directionsService.route(request, function(result, status) {
          if (status == google.maps.DirectionsStatus.OK) {
              directionsDisplay.setDirections(result);
          }
      });
      				
  4. ルート検索をします。
    directionsService.route(request, function(result, status) {
    		

DirectionsResultの構造

DirectionsResult は以下のような構造となっています。
主なオブジェクトのみ記述しています。

DirectionsResult

 ┃
 ┃
 ┗━DirectionsRouteの配列 検索した結果のルート情報が格納されます

     ┃
     ┃
     ┣━TransitFare
     ┃
     ┃
     ┃
     ┗━DirectionsLegの配列 waypoint等で分割されたルートの情報が格納されます

         ┃
         ┃
         ┣━Distance
         ┃
         ┃
         ┃
         ┣━Duration
         ┃
         ┃
         ┃
         ┗━DirectionsStepの配列 DirectionsLegを直線に分割した情報がdirectionsStepとして格納されています。

             ┃
             ┃
             ┣━Distance
             ┃
             ┃
             ┃
             ┣━Duration
             ┃
             ┃
             ┃
             ┗━DirectionsStepの配列 DirectionsStepsが階層化されています。この内容はまだ不明です

                 ┃
                 ┃
                 ┗━ ・・・続く

DirectionsLeg の中にDirectionsStepの配列があり、DirectionsStepの中にまた、DirectionsStepの配列があるという複雑な形となっています。

DirectionsResult詳細

不明な部分もまだ多くありますが、実際にルート検索した結果から、わかった情報を以下に記載します。
実際にDirectionsService調査デモのページで操作してみてください。

DirectionsResult

  1. routes
    • 検索結果複数のルートが見つかった場合、DerectionsResult の routesが複数格納されます。
    • DirectionsRendererのsetPanelでの表示結果に以下のようにルートの一覧が表示されます。
    • このルート一覧からルートを選択すると、地図のルート表示も同期して更新されます。

DirectionsRoute

検索された一つのルートの情報が格納されています。
  1. bounds
    • ルートを囲む矩形(緯度、経度)が格納されています。
  2. legs
    • waypointで分割されたパスごとに、legsの配列として格納されているようです。
  3. overview_path
    • ルートのパスのそれぞれのポイントの緯度経度が格納されています。
    • このパスをgoogle.maps.Polylineに与えると、地図上にルートのパスが表示されます。
      var routeLinePath = new google.maps.Polyline({
           path: routeResult.routes[0].overview_path,
           geodesic: true,
           strokeColor: '#FF0000',
           strokeOpacity: 0.5,
           strokeWeight: 6
       });
      	 			
    • legs,step.path の中のpathのほうがより細かい情報となっているようです。
    • ルート検索(directionsService.route) で検索した結果が表示されている地図の上に、overview_pathでPolylineを描画したら以下のように差がありました。
      • 赤いラインがoverview_pathで描画したPolylineです。
      • 青いラインが、ルート検索して表示されたルートのラインです。
  4. overview_polyline
    • ルート検索のパスが、文字列で格納されています。
    • パスの情報を送信する時等に使えると思います。
    • google.maps.Polyline のパスに指定すると、ルートのパスを地図上に表示できました。
      var routeLinePath = new google.maps.Polyline({
          path: google.maps.geometry.encoding.decodePath(
                      routeResult.routes[0].overview_polyline),
          geodesic: true,
          strokeColor: '#0000FF',
          strokeOpacity: 0.5,
          strokeWeight: 6
      });
      				
  5. warning
    • DirectionsRenderersetPanel の表示先に表示される以下の文言が格納されていました。
      • 「徒歩ルートの表示は Beta 版です。 注意 – このルートには歩道のない道が含まれている可能性があります。」

DirectionsLeg

waypointで分割したルートの情報が格納されているようです。
  1. steps
    • 曲がり角等毎に分割した情報をDirectionsStepの配列として格納してあります。

DirectionsStep

  1. distance
    • 距離情報が格納れています。
  2. duration
    • 移動時間が格納されています。
    • instructions に「横断歩道を渡る」等、DirectionsRendererのsetPanelで指定した領域に表示されているものと同じテキストが格納されていました。
  3. path
    • Stepの中の詳細なパス情報が緯度経度の配列で格納されているようです。
    • このpathでPolylineを描画すると、ルート検索で表示されたルートと同じラインとなりました。
    • ルート検索の結果は、DirectionsStepのpathでラインをつないで描画していると思われます。
      • 赤いラインが、DirectionsStepのpathで描画したPolylineです。(青いラインと重なって、紫色になっていますが、青いラインと同じことがわかると思います。)
      • 青いラインが、ルート検索時に描画されたラインです。
  4. steps
    • さらに詳細な情報がDirectionsStepの配列として格納されていると思われますが、実際に格納されている情報はまだ確認できていません。


主な更新履歴
  • 2015年4月
    • 初版