Migrer vers la nouvelle interface Nearby Search

Cette page explique les différences entre la recherche à proximité utilisée dans la classe Place (nouvelle) et la classe PlacesService (ancienne), et fournit quelques extraits de code à des fins de comparaison.

• L'ancienne PlacesService comporte une méthode nearbySearch() qui vous permet de rechercher des lieux dans une zone définie par mot clé ou par type.
• La classe Place comporte une méthode searchNearby() qui vous permet de rechercher des lieux dans une zone spécifiée par type de lieu. Elle utilise une sélection élargie de champs de données et de types de lieux pour une plus grande flexibilité.

Le tableau suivant liste certaines des principales différences entre les méthodes de recherche à proximité des classes Place et PlacesService :

Comparaison de code

Cette section compare le code des méthodes de recherche à proximité pour illustrer les différences entre le service Places et la classe Place. Les extraits de code montrent le code requis sur chaque API respective pour effectuer une requête de recherche textuelle.

Nearby Search (ancienne version)

L'ancienne fonctionnalité Nearby Search permet de rechercher des lieux dans une zone définie par mot clé ou par type. Il n'existe aucun moyen de contraindre les recherches à l'aide des champs de données de lieu. Tous les champs disponibles sont donc renvoyés avec chaque requête. L'extrait suivant montre comment appeler nearbySearch() pour renvoyer des informations sur les restaurants à Sydney, en Australie. La requête est synchrone, utilise un rappel et inclut une vérification conditionnelle obligatoire sur 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,
  });
}

En savoir plus

• Consulter la documentation sur l'ancienne API Nearby Search
• Consulter la documentation de référence sur searchNearby()

Nearby Search (nouveau)

La nouvelle version de Nearby Search apporte les améliorations suivantes :

• La possibilité de spécifier les champs de données de lieu à renvoyer.
• L'utilisation de promesses qui permet une opération asynchrone.
• Il n'est pas nécessaire de vérifier l'état de PlacesService. Vous pouvez utiliser la gestion des erreurs standard à la place.

L'extrait de code suivant montre une fonction qui envoie une requête Nearby Search pour les restaurants. Cet exemple montre comment utiliser l'option rankPreference pour classer les résultats de recherche par popularité (dans la version précédente, le classement était spécifié à l'aide de l'option rankBy). Étant donné que la méthode searchNearby() utilise l'opérateur await, elle ne peut être utilisée que dans une fonction 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");
  }
}

En savoir plus

• Voir l'exemple de code complet
• Consulter la documentation sur Nearby Search (nouveau)
• Consulter la documentation de référence sur searchNearby()