このページは Cloud Translation API によって翻訳されました。

Nearby Search（新機能）API でローカル検索を改善

このドキュメントでは、Nearby Search（新版）API を使用して、シンプルで費用対効果の高い

ローカル検索機能

ローカル検索では、ホテルや不動産を検索する際に、指定した場所の近くにある重要なスポットが表示されます。多くの場合、インタラクティブな地図と、スポット選択ツールや写真のギャラリーを含む追加のパネルで構成されています。インタラクティブなエクスペリエンスを強化するための、さまざまな Google Maps Platform のプロダクトと機能が紹介されます。

ローカル検出のサンプル

ユースケース

次に、ローカル検出の統合のどの要素がユーザー価値を高めるのかを理解しましょう。

探索 - さまざまな種類の関連する場所を表示して、1 つの場所の周辺の概要をユーザーに提供します。
インタラクティビティ - ユーザーが場所を選択し、データを動的に更新できるようにする

をその場所に対して相対的に表します。
可視化 - 場所のレビューや写真を提供する

ユーザーがニーズに合っているかどうかをすばやく把握できるようにしました

リファレンスアーキテクチャ

alt_text

ローカル検索

ローカル探索機能はさまざまな方法で作成できます。次の統合は、有名な Google Maps Platform API といくつかの新機能を活用したユーザーエクスペリエンスのカスタムサンプルです。ローカル検出にテンプレートアプローチを使用する場合は、ウェブコンポーネントを使用できます。

サンプルアプリケーション

サンプルチュートリアル

以下の表に、サンプルアプリケーションをステップごとに示し、Google Maps Platform API を使用した技術的な実装の説明を示します。

1. AutocompleteSearch location を使用する場所検索

Maps JavaScript API を読み込みます。
Places Autocomplete をクエリしたり、地図上の場所を選択したりできます。

予測入力のサンプル

2. Nearby Search（新版）API を使用してローカルのスポットを表示する

人気度ランキング（より関連性の高い結果）または距離ランキング。
includedTypes、excludedTypes: ホテルの場合は、「宿泊施設」の種類を除外し、適切な種類のみ（レストラン、カフェ、公園、観光スポットなど）を含めることができます。
includedPrimaryTypes と excludedPrimaryTypes を使用して、結果をさらに細かく制御します。
locationRestriction を使って、結果の数が不十分な場合や場所が遠すぎることを避けることができます。結果が 0 件の場合は、結果を表示する前に円または長方形のサイズを広げる必要があります。

付近の場所のサンプル

データフィールドをリクエストしてホテルを予約する場合のクエリ例:

基本（displayName、types、openingHours、formattedAddress）
連絡先（websiteUri、nationalPhoneNumber、internationalPhoneNumber）
優先（reviews、priceLevel、userRatingCount）

 { "includedTypes": ["restaurant","cafe","park"], "excludedTypes":
["lodging","convenience_store"], "includedPrimaryTypes":
["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes":
["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": {
"center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }

データフィールドをリクエストして不動産を検索する場合のクエリのサンプル:

基本（displayName、types、openingHours、formattedAddress）

 { "includedTypes": ["school","transport","bus","convenience_store"],
"excludedTypes": ["lodging"], "includedPrimaryTypes":
["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes":
["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": {
"center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }

3. Dynamic Maps と Directions API を使用してインタラクティビティを追加する

Directions API をクエリして、最新の区間とステップを取得。 * 次のセクションでは時間を使用します。

サンプルの指示

4. 操作時に場所の詳細情報を表示する

説明: displayName、types、rating、userRatingCount、priceLevel。

時間: 前の Directions API クエリから取得。
レビュー: reviews[i].author、reviews[i].rating、reviews[i].text。
画像: Nearby Search（新）API の無制限プレビュー中は、place.id を使用して Places Details に対してクエリを実行し、photo_reference を取得し、エクスペリエンス内で一度に 1 つずつクエリを実行する必要があります。

場所の詳細

クエリの数と関連する費用

Maps JavaScript API: エクスペリエンスの読み込み時に 1 つの地図。
Places Autocomplete API: 入力された文字ごとに 1 回のリクエスト（Autocomplete ウィジェットを使用している場合）。カスタマイズ可能です。
Nearby Search（新版）API: 20 か所の表示ごとに 1 回のクエリクエリレスポンスの一部である場所データに応じて異なる課金。
Directions API: ユーザーが選択した場所ごとに 1 件のクエリ。
Place Photo API: 表示される写真ごとに 1 件のクエリ。

まとめ

ローカル検索エクスペリエンスは、ユーザーに価値をもたらす優れた方法です。このデモ実装には、Google Maps Platform でこのようなエクスペリエンスを作成する際に、Nearby Search（新規）API の特別な機能とともに含める可能性のある多くの機能が含まれています。

次のステップ

寄稿者

主な作成者:

Thomas Anglaret | Google Maps Platform ソリューションエンジニア