Migrer vers les nouveaux avis sur les lieux

Développeurs de l'Espace économique européen (EEE)

Les avis sur les lieux vous permettent d'ajouter des avis et des notes d'utilisateurs à vos pages Web. Cette page explique les différences entre les avis sur les lieux tels qu'ils sont utilisés dans les classes Place (nouveau) et PlacesService (ancien), et fournit des extraits de code à des fins de comparaison.

  • PlacesService (ancienne méthode) renvoie un tableau d'instances PlaceReview dans l'objet PlaceResult pour toute requête getDetails() si le champ reviews est spécifié dans la requête.
  • Place (nouveau) renvoie un tableau d'instances Review dans une requête fetchFields() si le champ reviews est spécifié dans la requête.

Le tableau suivant liste certaines des principales différences dans l'utilisation des avis sur les lieux entre la classe Place et PlacesService :

PlacesService (ancienne) Place (Nouveau)
Interface PlaceReview Classe Review
Les méthodes nécessitent l'utilisation d'un rappel pour gérer l'objet de résultats et la réponse google.maps.places.PlacesServiceStatus. Utilise des promesses et fonctionne de manière asynchrone.
Les méthodes nécessitent une vérification PlacesServiceStatus. Aucune vérification de l'état n'est requise. Vous pouvez utiliser la gestion des erreurs standard. En savoir plus
PlacesService doit être instancié à l'aide d'une carte ou d'un élément div. Place peut être instancié où que ce soit, sans référence à une carte ni à un élément de page.
PlaceReview renvoie les données d'attribution de l'avis à l'aide des champs author_name, author_url et profile_photo_url. Review renvoie les données d'attribution de l'avis à l'aide d'une instance AuthorAttribution.

Comparaison de code

Cette section compare le code des méthodes de recherche de texte pour illustrer les différences entre les avis sur les lieux dans l'ancienne classe PlacesService et la nouvelle classe Place.

Service Places (ancien)

L'extrait suivant appelle getDetails() pour demander les détails du lieu, y compris les avis, et affiche le premier résultat d'avis dans une info-bulle.

const request = {
  placeId: "ChIJpyiwa4Zw44kRBQSGWKv4wgA", // Faneuil Hall Marketplace, Boston, MA
  fields: ["name", "formatted_address", "geometry", "reviews"],
};
const service = new google.maps.places.PlacesService(map);

service.getDetails(request, (place, status) => {
  if (
    status === google.maps.places.PlacesServiceStatus.OK &&
    place &&
    place.geometry &&
    place.geometry.location
  ) {
    // If there are any reviews display the first one.
    if (place.reviews && place.reviews.length > 0) {
      // Get info for the first review.
      let reviewRating = place.reviews[0].rating;
      let reviewText = place.reviews[0].text;
      let authorName = place.reviews[0].author_name;
      let authorUri = place.reviews[0].author_url;

      // Format the review using HTML.
      contentString =`
            <div id="title"><b>${place.name}</b></div>
            <div id="address">${place.formatted_address}</div>
            <a href="${authorUri}" target="_blank">Author: ${authorName}</a>
            <div id="rating">Rating: ${reviewRating} stars</div>
            <div id="rating"><p>Review: ${reviewText}</p></div>`;
    } else {
      contentString = `No reviews were found for ${place.name}`;
    }

    const infowindow = new google.maps.InfoWindow({
      content: contentString,
      ariaLabel: place.displayName,
    });

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

    // Show the info window.
    infowindow.open({
      anchor: marker,
      map,
    });
  }
});

Classe Place (nouveau)

L'extrait suivant appelle la méthode fetchFields() pour demander les détails du lieu, y compris les avis, et affiche le premier résultat d'avis dans une info-bulle.

// Use a place ID to create a new Place instance.
const place = new google.maps.places.Place({
  id: "ChIJpyiwa4Zw44kRBQSGWKv4wgA", // Faneuil Hall Marketplace, Boston, MA
});

// Call fetchFields, passing 'reviews' and other needed fields.
await place.fetchFields({
  fields: ["displayName", "formattedAddress", "location", "reviews"],
});

// If there are any reviews display the first one.
if (place.reviews && place.reviews.length > 0) {
  // Get info for the first review.
  let reviewRating = place.reviews[0].rating;
  let reviewText = place.reviews[0].text;
  let authorName = place.reviews[0].authorAttribution.displayName;
  let authorUri = place.reviews[0].authorAttribution.uri;

  // Format the review using HTML.
  contentString =`
          <div id="title"><b>${place.displayName}</b></div>
          <div id="address">${place.formattedAddress}</div>
          <a href="${authorUri}" target="_blank">Author: ${authorName}</a>
          <div id="rating">Rating: ${reviewRating} stars</div>
          <div id="rating"><p>Review: ${reviewText}</p></div>`;
} else {
  contentString = `No reviews were found for ${place.displayName}`;
}

// Create an infowindow to display the review.
infoWindow = new google.maps.InfoWindow({
  content: contentString,
  ariaLabel: place.displayName,
});

// Add a marker.
const marker = new google.maps.marker.AdvancedMarkerElement({
  map,
  position: place.location,
  title: place.displayName,
});

// Show the info window.
infoWindow.open({
  anchor: marker,
  map,
});