車で目的地に移動する際のユーザー エクスペリエンスを最大限に高めるためのヒント

このドキュメントは、以前のバージョンの GMP API を使用した古い記事を更新したものです。このコンテンツは、2023 ~ 24 年にリリースされた Places API の新しいバージョンと、2023 年にリリースされた Routes API に合わせて更新されています。

通常、ユーザーがスポット(地図上の場所)に車で向かう場合、実際には駐車場やアクセス ポイントなどの近くの場所へのナビゲーションを必要とします。空港やショッピング モールに行く必要があるドライバーを想像してみてください。空港に向かう場合、ドライバーは空港の敷地の中心ではなく、ターミナルまたは降車地点を目指しています。同様に、車で移動するユーザーには、ショッピング モールの隣にある駐車場の方がはるかに便利なオプションになる可能性があります。この場合、ドライバーを案内するアプリやサービスを開発する場合は、まず目的地を特定し、その場所の近くにあるオプションの目的地をドライバーに提示します。このアプローチでは、Google Maps Platform が提供する位置情報を活用して、小規模ながらスマートな開発作業で、顧客に優れたサービスを提供しながら、顧客の時間を尊重していることを示すことができます。

システム図

ここでは、新しい Places APIRoutes API を順番に、または組み合わせて使用し、目的地の近くに駐車するのに適した場所を特定する方法について説明します。このソリューションは、最終目的地に近づいたときに、駐車スペースを探すために不確実性や複数の操作を排除することを目的としています。これらのケースを実装する方法の 2 つの例を詳しく見てみましょう。

例 1 - 駐車場のない観光スポット

道路に直接接続されていない場所を選択して、ルートを個別に取得します。目的地はパリのノートルダム出発地Gare de l'Est 鉄道駅(48.87697775149635、2.3592247806755564)です。

Gare l'Est

運転手はノートルダムから北へ 16 分ほど走った場所で駅を出ます。ノートルダムは、橋でアクセスできる島にある有名な観光スポットです。一方通行の道路もあり、近くに大きな駐車場はありません。興味深い課題になるはずです。

  1. Places API リクエスト

この Places API リクエストの例では、テキスト検索を使用してノートルダム大聖堂を検索しています。詳しくは、デベロッパー向けドキュメントをご覧ください。これらの例の「$APIKEY」は、Google Cloud コンソールで有効にした Google Maps Platform Places API と Routes API の API キーです。詳細については、Google Maps Platform スタートガイドのドキュメントをご覧ください。

新しい Places API リクエストの形式は新しくなりました。レスポンス フィールドは固定されなくなったため、デベロッパーはヘッダーにフィールドマスクを定義する必要があります。フィールドマスクの使用については、ドキュメントをご覧ください。

curl -X POST --data @notre_dame.json \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
-H 'X-Goog-FieldMask: places.id,places.displayName,places.formattedAddress,places.location' \
'https://places.googleapis.com/v1/places:searchText'

検索パラメータに「notre_date.json」コンテンツを使用する場合:

{
   "textQuery": "Notre Dame, Paris",
   "languageCode": "en"
}

上記のリクエストのレスポンスには、次の緯度と経度の座標が返されます。

{
  "places": [
    {
      "id": "ChIJATr1n-Fx5kcRjQb6q6cdQDY",
      "formattedAddress": "6 Parvis Notre-Dame - Pl. Jean-Paul II, 75004 Paris, France",
      "location": {
        "latitude": 48.852968200000007,
        "longitude": 2.3499021
      },
      "displayName": {
        "text": "Cathédrale Notre-Dame de Paris",
        "languageCode": "en"
      }
    }
  ]
}

ご覧のとおり、座標はノートルダム大聖堂の正確な位置を示しています。

ノートルダム大聖堂の入り口の写真 ノートルダム周辺の地図

デベロッパーまたはサービス プロバイダは、ドライバーに「ノートルダム大聖堂の近くに駐車場を探していますか?」というメッセージを自動的に表示することをおすすめします。また、ドライバーが電気自動車を使用している場合は、充電スタンドを検索することもできます。ユーザー エクスペリエンスはデバイスと画面によって異なりますが、この場合は、しばらくすると消える控えめなダイアログ テキストを検討することをおすすめします。ノートルダム大聖堂の近くの駐車場を検索するには、Places API の Nearby Search で、タイプ「parking」と「electric_vehicle_charging_station」、半径 500 メートルで検索します。次の例では、ノートルダムから 500 m 以内の駐車場に結果を重み付けします。

curl -X POST -d '{
  "includedTypes": ["parking", "electric_vehicle_charging_station"],
  "maxResultCount": 10,
  "rankPreference": "DISTANCE",
  "locationRestriction": {
    "circle": {
      "center": {
        "latitude": 48.852968200000007,
        "longitude": 2.3499021},
      "radius": 500.0
    }
  }
}' \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
-H "X-Goog-FieldMask: places.displayName,places.location" \
https://places.googleapis.com/v1/places:searchNearby

最初の結果は、48.854981、2.350629 の充電スタンドですが、この例を実行する時点では結果が異なる場合があります。この場所は、次のパートで Routes API リクエストを行う際に使用します。

  1. **Routes API リクエスト **

駅からノートルダム近くの充電スタンドまでのルートを検索するには、Routes API リクエストを行う必要があります。出発地と目的地のパラメータを設定するだけです。その他のオプションについては、デベロッパー向けドキュメントをご覧ください。

curl -X POST -d '{
  "origin":{
    "location":{
      "latLng":{
        "latitude": 48.87697775149635,
        "longitude": 2.3592247806755564
      }
    }
  },
  "destination":{
    "location":{
      "latLng":{
       "latitude": 48.854981,
        "longitude": 2.350629
      }
    }
  },
  "travelMode": "DRIVE",
  "routingPreference": "TRAFFIC_AWARE",
  "departureTime": "2024-05-16T15:01:23.045123456Z",
  "computeAlternativeRoutes": false,
  "routeModifiers": {
    "avoidTolls": false,
    "avoidHighways": false,
    "avoidFerries": false
  },
  "languageCode": "en-US",
  "units": "METRIC"
}' \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
-H 'X-Goog-FieldMask: routes.duration,routes.distanceMeters,routes.legs,routes.polyline.encodedPolyline' \
'https://routes.googleapis.com/directions/v2:computeRoutes'

通常、Routes API レスポンスには複数の経路候補が含まれます。ルートデータをレスポンスに含めるには、フィールドマスクで「routes.legs」を定義します。各ルートは複数の「レグ」で構成され、レグには移動距離と座標を示す複数の「ステップ」が含まれています。車で到達できる最終的な座標を確認するには、選択したルートの最後の区間の最後のステップの [endLocation] フィールドを使用します。"latitude": 48.854937299999996, "longitude": 2.3505841999999997

この場所は、一見するとおすすめの場所ではないようですが、地図や Google ストリートビューで見ると、ノートルダム大聖堂から徒歩 6 ~ 7 分という非常に近い場所にあります。

ノートルダムまでのルート

充電スタンドの駐車場からノートルダム大聖堂までの徒歩ルート

例 1 の概要

ご覧のとおり、自動車の駐車場を検索するには、数回 API を呼び出して、ドライバーに候補を表示するだけで済みます。一方通行の道路を走行したり、混雑した観光地で駐車場を探したりする必要がないため、ユーザーは時間を節約できます。概要として、次の API リクエストを行いました。

  • ノートルダムの座標を検索する Places API テキスト検索リクエスト
  • Places API の近くの検索を使用して、指定した座標から 500 メートル以内に電気自動車充電スタンドがある駐車場を探す
  • 充電スタンドまでのルートを検索する Routes API リクエスト

例 2 - 大規模な空港のターミナルへの案内

ヒースロー空港の地図

ドライバーが複数の場所、スポット、または配達ポイントがある広いエリアに到達しようとしている場合の別の例を考えてみましょう。ドライバーは、英国のウェンブリー スタジアム(51.557263604707224、-0.2794575145680608)を出発し、ロンドン ヒースロー空港ターミナル 5 に向かっています。

新しい Places API の Autocomplete の優れた点は、検索条件としてプライマリ タイプを定義し、API がサブプレミスを検索結果として予測する機能と組み合わせることができることです。この場合、空港を検索するとターミナルも返されます。含めるまたは除外するタイプの一覧については、ドキュメントをご覧ください。

curl -X POST -d '{
  "input": "Heathrow",
  "includedPrimaryTypes": ["airport"]
}' \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
https://places.googleapis.com/v1/places:autocomplete

上記のクエリでは、ターミナルと、そのターミナルの個々のドロップオフ ポイントのリストが返されます。検索結果のリストから、「ロンドン ヒースロー空港 ターミナル 5」とそのプレイス ID を確認できます。

"place_id" : "ChIJo21hnPxxdkgRksRL0KQRWII",

「placeId」パラメータを使用すると、任意の座標ではなく、特定の場所を目指していることを Routes API に伝えることができます。

curl -X POST -d '{
  "origin":{
    "location":{
      "latLng":{
        "latitude": 51.557263604707224,
        "longitude": -0.2794575145680608
      }
    }
  },
  "destination":{
    "placeId": "ChIJo21hnPxxdkgRksRL0KQRWII"
  },
  "travelMode": "DRIVE",
  "routingPreference": "TRAFFIC_AWARE",
  "departureTime": "2024-05-16T15:01:23.045123456Z",
  "computeAlternativeRoutes": false,
  "languageCode": "en-US",
  "units": "METRIC"
}' \
-H 'Content-Type: application/json' -H "X-Goog-Api-Key: $APIKEY" \
-H 'X-Goog-FieldMask: routes.duration,routes.distanceMeters,routes.legs,routes.polyline.encodedPolyline' \
'https://routes.googleapis.com/directions/v2:computeRoutes'

前述の例と同様に、JSON レスポンスのすべてのステップを読み取ると、ルートの最後の部分と終点の緯度と経度の座標(51.4714348、"longitude": -0.48967890000000003)を確認できます。

ターミナル 5 のストリートビュー

例 2 の概要

前の例と同様に、ドライバーに改善されたガイダンスを提供するための開発作業は非常に少なく、ドライバーが節約できる時間のメリットを測定できます。以下のリクエストを行いました。

  • ヒースロー空港のターミナル 5 を検索する Places API Autocomplete(新規)リクエスト
  • ウェンブリーからターミナル 5 へのルートを取得する Routes API リクエスト

この例では、新しい Places API 機能の一部のみを説明しています。空港や国際空港など、新しい場所の種類をご確認ください。

まとめ

ご覧のとおり、自動車で移動するお客様にプレミアム サービスを提供するために必要な開発作業は比較的少なく、お客様のニーズをどのように考えているかを示すことができます。

開発目的では、利用可能な多くのライブラリとツールを使用して、お客様向けのサービスを構築できます。一般公開されている Google マップ プラットフォームの GitHub リポジトリをご覧ください。

次のアクション

GMP スタートガイド : https://developers.google.com/maps/get-started

おすすめの関連情報

Places API autocomplete(新規)のドキュメント: https://developers.google.com/maps/documentation/places/web-service/place-autocomplete

Routes API のドキュメント: https://developers.google.com/maps/documentation/routes

寄稿者

主な作成者: Mikko Toivanen | Google Maps Platform ソリューション エンジニア