מעבר לממשק החדש של ביקורות על מקומות

התכונה 'ביקורות על מקומות' מאפשרת לכם להוסיף דירוגים וביקורות של משתמשים לדפי האינטרנט שלכם. בדף הזה מוסבר מה ההבדל בין ביקורות על מקומות כפי שהן משמשות בכיתה Place (חדשה) ובכיתה PlacesService (קודמת), ומופיעים כמה קטעי קוד להשוואה.

  • PlacesService (מדור קודם) מחזירה מערך של מכונות PlaceReview כחלק מהאובייקט PlaceResult לכל בקשת getDetails(), אם השדה reviews צוין בבקשה.
  • הפונקציה Place (חדשה) מחזירה מערך של מכונות Review כחלק מבקשת fetchFields(), אם השדה reviews צוין בבקשה.

בטבלה הבאה מפורטים חלק מההבדלים העיקריים בשימוש בסקירות של מקומות בין הסוג Place לבין הסוג PlacesService:

PlacesService (דור קודם) Place (חדש)
ממשק PlaceReview הכיתה Review
כדי לטפל באובייקט התוצאות ובתגובה google.maps.places.PlacesServiceStatus, צריך להשתמש ב-method עם קריאה חוזרת. משתמשת ב-Promises ופועלת באופן אסינכרוני.
שיטות דורשות בדיקה של PlacesServiceStatus. אין צורך בבדיקת סטטוס, אפשר להשתמש בטיפול שגיאות רגיל.
צריך ליצור מופע של PlacesService באמצעות מפה או רכיב div. אפשר ליצור מופע של Place בכל מקום שבו יש צורך, בלי הפניה למפה או לאלמנט בדף.
הפונקציה PlaceReview מחזירה את נתוני השיוך של הבדיקה באמצעות השדות author_name,‏ author_url ו-profile_photo_url. הפונקציה Review מחזירה את נתוני השיוך של הבדיקה באמצעות מופע של AuthorAttribution.

השוואת קוד

בקטע הזה מוצגת השוואה בין קוד של שיטות חיפוש טקסט כדי להמחיש את ההבדלים בין ביקורות על מקומות בסוג הקודם PlacesService לבין ביקורות על מקומות בסוג החדש Place.

שירות Places (קודם)

קטע הקוד הבא קורא ל-getDetails() כדי לבקש פרטים על המקום, כולל ביקורות, ומציג את תוצאת הביקורת הראשונה בחלון מידע.

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

סיווג מקום (חדש)

קטע הקוד הבא קורא ל-method‏ fetchFields() כדי לבקש פרטי מקום, כולל ביקורות, ומציג את תוצאת הביקורת הראשונה בחלון מידע.

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