Przejście na nową funkcję Opinie o miejscach

Deweloperzy z Europejskiego Obszaru Gospodarczego (EOG)

Opinie o miejscach umożliwiają dodawanie opinii i ocen użytkowników do stron internetowych. Na tej stronie wyjaśniamy różnice między opiniami o miejscach używanymi w klasie Place(nowa wersja) a PlacesService (starsza wersja) oraz przedstawiamy fragmenty kodu do porównania.

  • PlacesService (starsza wersja) zwraca tablicę instancji PlaceReview jako część obiektu PlaceResult w przypadku każdego żądania getDetails() jeśli w żądaniu określono pole reviews.
  • Place (nowa wersja) zwraca tablicę instancji Review jako część żądania fetchFields(), jeśli pole reviews jest określone w żądaniu.

W tabeli poniżej znajdziesz niektóre z głównych różnic w korzystaniu z opinii o miejscach między klasą Place a PlacesService:

PlacesService (starsza wersja) Place (nowa wersja)
PlaceReview interfejs Review zajęcia
Metody wymagają użycia wywołania zwrotnego do obsługi obiektu wyników i google.maps.places.PlacesServiceStatus odpowiedzi. Używa obietnic i działa asynchronicznie.
Metody wymagają sprawdzenia PlacesServiceStatus. Nie jest wymagane sprawdzanie stanu, można użyć standardowej obsługi błędów. Więcej informacji.
PlacesService musi zostać utworzony za pomocą mapy lub elementu div. Place można utworzyć w dowolnym miejscu, bez odniesienia do mapy lub elementu strony.
PlaceReview zwraca dane o autorstwie opinii za pomocą pól author_name, author_url i profile_photo_url. Review zwraca dane o autorstwie opinii za pomocą instancji AuthorAttribution.

Porównanie kodu

W tej sekcji porównujemy kod metod wyszukiwania tekstowego, aby zilustrować różnice między opiniami o miejscach w starszej wersji PlacesService a nowszej klasie Place.

Usługa Miejsca (starsza wersja)

Ten fragment kodu wywołuje getDetails(), aby poprosić o szczegóły miejsca, w tym opinie, i wyświetla pierwszy wynik opinii w dymku.

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,
    });
  }
});

Klasa Place (nowa wersja)

Ten fragment kodu wywołuje fetchFields() metodę, aby poprosić o szczegóły miejsca, w tym opinie, i wyświetla pierwszy wynik opinii w dymku.

// 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,
});