نقل البيانات إلى ميزة "مراجعات الأماكن" الجديدة

تتيح لك ميزة "مراجعات الأماكن" إضافة مراجعات المستخدمين وتقييماتهم إلى صفحات الويب. توضّح هذه الصفحة اختلافات مراجعات الأماكن المستخدَمة في فئة Place (الجديدة) وفئة PlacesService (القديمة)، كما تقدّم بعض مقتطفات الرموز البرمجية للمقارنة.

  • يعرض PlacesService (القديم) صفيفًا من عناصر PlaceReview كجزء من عنصر PlaceResult لأي طلب getDetails() إذا تم تحديد الحقل reviews في الطلب.
  • تعرض دالة Place (الجديدة) مصفوفة من مثيلات Review كجزء من طلب fetchFields() إذا تم تحديد الحقل reviews في الطلب.

يسرد الجدول التالي بعض الاختلافات الرئيسية في استخدام مراجعات الأماكن بين الفئة Place والفئة PlacesService:

PlacesService (قديمة) Place (ميزة جديدة)
واجهة PlaceReview صف Review
تتطلّب الطرق استخدام دالة ردّ اتصال لمعالجة عنصر النتائج وgoogle.maps.places.PlacesServiceStatus الاستجابة. يستخدم وعدًا، ويعمل بشكل غير متزامن.
يجب وضع علامة PlacesServiceStatus في المربّع بجانب الطرق. لا يلزم التحقّق من الحالة، ويمكن استخدام معالجة الأخطاء العادية.
يجب إنشاء مثيل لسمة PlacesService باستخدام عنصر div أو عنصر div. يمكن إنشاء مثيل لعنصر Place في أي مكان مطلوب، بدون الإشارة إلى خريطة أو عنصر صفحة.
يعرض الحقل PlaceReview بيانات تحديد المصدر للمراجعة باستخدام الحقول author_name وauthor_url و profile_photo_url. تعرِض Review بيانات تحديد المصدر للمراجعة باستخدام نسخة من AuthorAttribution.

مقارنة الرموز

يقارن هذا القسم الرمز البرمجي لطرق البحث النصي لتوضيح الاختلافات بين مراجعات الأماكن في الفئة القديمة PlacesService والفئة الأحدث Place.

خدمة "الأماكن" (الإصدار القديم)

تستدعي المقتطف التالي 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,
    });
  }
});

فئة المكان (جديد)

يستدعي المقتطف التالي 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,
});