新しい Nearby Search に移行する

このページでは、Place クラス(新規)と PlacesService(従来)で使用される周辺検索の違いについて説明します。また、比較用のコード スニペットも示します。

  • 以前の PlacesService には nearbySearch() メソッドがあり、指定された範囲内でキーワードやタイプによるプレイス検索が可能です。
  • Place クラスには searchNearby() メソッドがあり、指定されたエリア内の場所を場所の種類で検索できます。場所データのフィールドと場所の種類の選択肢が広がっており、柔軟性が向上しています。

次の表に、Place クラスと PlacesService クラスの周辺検索方法の主な違いを示します。

PlacesService(レガシー) Place(新規)
nearbySearch()
searchNearby()
PlaceSearchRequest SearchNearbyRequest
結果オブジェクトと google.maps.places.PlacesServiceStatus レスポンスを処理するには、コールバックを使用する必要があります。 Promise を使用し、非同期で動作します。
PlacesServiceStatus チェックが必要です。 ステータス チェックは不要で、標準のエラー処理を使用できます。
位置情報バイアスのみをサポートします。 地域のバイアスや地域の制限をサポートしています。
利用可能なすべてのデータ フィールド(サポートされるフィールドのサブセット)を返します。特定のフィールドに制限することはできません。 リクエストされた場所データ フィールドのみを返します。Place クラスは、拡張されたフィールドの選択肢を提供し、定期的に更新されます。
場所タイプの固定セットに限定されます。 拡張され、定期的に更新される場所タイプの選択肢にアクセスできます。
キーワードを使用したテキストベースの検索がサポートされています。 テキストベースの検索はサポートされていません。代わりにテキスト検索(新版)を使用してください。

コードの比較

このセクションでは、周辺検索メソッドのコードと、Places Service と Place クラスの違いを比較します。コード スニペットは、テキストベースの検索リクエストを行うために各 API で必要なコードを示しています。

Nearby Search(従来版)

従来の周辺検索では、指定された範囲内で、キーワードやタイプによる場所の検索が可能です。場所データ フィールドを使用して検索を制限することはできないため、利用可能なすべてのフィールドが各リクエストで返されます。次のスニペットは、nearbySearch() を呼び出して、オーストラリアのシドニーにあるレストランに関する情報を返します。リクエストは同期で、コールバックを使用し、PlacesServiceStatus に対する必要な条件チェックが含まれています。

let map;
let service;

function initMap() {
  const sydney = new google.maps.LatLng(-33.867, 151.195);

  map = new google.maps.Map(document.getElementById("map"), {
    center: sydney,
    zoom: 15,
  });

  const request = {
    location: sydney,
    radius: '500',
    type: ['restaurant']
  };

  service = new google.maps.places.PlacesService(map);
  service.nearbySearch(request, callback);
}

function callback(results, status) {
  if (status == google.maps.places.PlacesServiceStatus.OK) {
    for (var i = 0; i < results.length; i++) {
      createMarker(results[i]);
    }
  }
}

// Helper function to create markers.
function createMarker(place) {
  if (!place.geometry || !place.geometry.location) return;

  const marker = new google.maps.Marker({
    map,
    position: place.geometry.location,
    title: place.name,
  });
}

その他の情報

Nearby Search(新規)

新バージョンの Nearby Search は、次のように以前のバージョンを改善しています。

  • 返す場所データ フィールドを指定できる。
  • 非同期オペレーションを可能にする Promise の使用。
  • PlacesService のステータスを確認する必要はありません。代わりに標準のエラー処理を使用できます。

次のコード スニペットは、レストランの周辺検索リクエストを行う関数を示しています。この例では、rankPreference オプションを使用して検索結果を人気度でランク付けしています(以前のバージョンでは、rankBy オプションを使用してランキングを指定していました)。searchNearby() メソッドは await 演算子を使用するため、async 関数内でのみ使用できます。

async function nearbySearch() {
  // Restrict within the map viewport.
  let center = new google.maps.LatLng(52.369358, 4.889258);
  const request = {
    // Required parameters.
    fields: ["displayName", "location", "businessStatus"],
    locationRestriction: {
      center: center,
      radius: 500,
    },
    // Optional parameters.
    includedPrimaryTypes: ["restaurant"],
    maxResultCount: 5,
    rankPreference: google.maps.places.SearchNearbyRankPreference.POPULARITY,
    language: "en-US",
    region: "us",
  };

  const { places } = await google.maps.places.Place.searchNearby(request);

  if (places.length) {
    console.log(places);

    // Create a new bounds, which will be extended with each result.
    const bounds = new google.maps.LatLngBounds();

    // Loop through and get all the results.
    places.forEach((place) => {
      const markerView = new google.maps.marker.AdvancedMarkerElement({
        map,
        position: place.location,
        title: place.displayName,
      });

      bounds.extend(place.location);
      console.log(place);
    });
    map.fitBounds(bounds);
  } else {
    console.log("No results");
  }
}

その他の情報