ย้ายข้อมูลไปยัง "รีวิวสถานที่" เวอร์ชันใหม่
จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน
บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ
นักพัฒนาแอปในเขตเศรษฐกิจยุโรป (EEA)
รีวิวสถานที่ช่วยให้คุณเพิ่มรีวิวและการให้คะแนนของผู้ใช้ลงในหน้าเว็บได้ หน้านี้
อธิบายความแตกต่างระหว่างรีวิวสถานที่ตามที่ใช้ในคลาส Place
(ใหม่) และ PlacesService
(เดิม) รวมถึงแสดงข้อมูลโค้ดบางส่วนเพื่อ
เปรียบเทียบ
PlacesService
(เดิม) จะแสดงผลอาร์เรย์ของอินสแตนซ์ PlaceReview
เป็นส่วนหนึ่งของออบเจ็กต์ PlaceResult
สำหรับคำขอ getDetails()
หากมีการระบุฟิลด์ reviews
ในคำขอ
Place
(ใหม่) แสดงผลอาร์เรย์ของอินสแตนซ์ Review
เป็นส่วนหนึ่งของคำขอ fetchFields()
หากมีการระบุฟิลด์ reviews
ในคำขอ
ตารางต่อไปนี้แสดงความแตกต่างหลักบางประการในการใช้รีวิวสถานที่ระหว่างคลาส Place
กับ PlacesService
PlacesService (เดิม) |
Place (ใหม่) |
อินเทอร์เฟซ PlaceReview |
Review ชั้นเรียน |
เมธอดต้องใช้การเรียกกลับเพื่อจัดการออบเจ็กต์ผลลัพธ์และ
google.maps.places.PlacesServiceStatus การตอบกลับ |
ใช้ Promise และทำงานแบบไม่พร้อมกัน |
วิธีการต้องผ่านPlacesServiceStatus การตรวจสอบ |
ไม่ต้องตรวจสอบสถานะที่จำเป็น ใช้การจัดการข้อผิดพลาดมาตรฐานได้
ดูข้อมูลเพิ่มเติม |
PlacesService ต้องสร้างอินสแตนซ์โดยใช้แผนที่หรือองค์ประกอบ 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,
});
เนื้อหาของหน้าเว็บนี้ได้รับอนุญาตภายใต้ใบอนุญาตที่ต้องระบุที่มาของครีเอทีฟคอมมอนส์ 4.0 และตัวอย่างโค้ดได้รับอนุญาตภายใต้ใบอนุญาต Apache 2.0 เว้นแต่จะระบุไว้เป็นอย่างอื่น โปรดดูรายละเอียดที่นโยบายเว็บไซต์ Google Developers Java เป็นเครื่องหมายการค้าจดทะเบียนของ Oracle และ/หรือบริษัทในเครือ
อัปเดตล่าสุด 2025-08-31 UTC
[null,null,["อัปเดตล่าสุด 2025-08-31 UTC"],[],[],null,["# Migrate to the new Place Reviews\n\n\u003cbr /\u003e\n\n**European Economic Area (EEA) developers** If your billing address is in the European Economic Area, effective on 8 July 2025, the [Google Maps Platform EEA Terms of Service](https://cloud.google.com/terms/maps-platform/eea) will apply to your use of the Services. Functionality varies by region. [Learn more](/maps/comms/eea/faq).\n\nPlace reviews lets you add user reviews and ratings to your web pages. This page\nexplains the differences between place reviews as used in the `Place` class\n(new) and `PlacesService` (legacy), and provides some code snippets for\ncomparison.\n\n- `PlacesService` (legacy) returns an array of [`PlaceReview`](/maps/documentation/javascript/reference/places-service#PlaceReview) instances as part of the `PlaceResult` object for any `getDetails()` request if the `reviews` field is specified in the request.\n- `Place` (new) returns an array of [`Review`](/maps/documentation/javascript/reference/place#Review) instances as part of a `fetchFields()` request if the `reviews` field is specified in the request.\n\nThe following table lists some of the main differences in the use of place\nreviews between the `Place` class and `PlacesService`:\n\n| [`PlacesService`](/maps/documentation/javascript/reference/places-service) (Legacy) | [`Place`](/maps/documentation/javascript/reference/place) (New) |\n|------------------------------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| [`PlaceReview`](/maps/documentation/javascript/reference/places-service#PlaceReview) interface | [`Review`](/maps/documentation/javascript/reference/place#Review) class |\n| Methods require the use of a callback to handle the results object and `google.maps.places.PlacesServiceStatus` response. | Uses Promises, and works asynchronously. |\n| Methods require a `PlacesServiceStatus` check. | No required status check, can use standard error handling. [Learn more](/maps/documentation/javascript/reference/errors). |\n| `PlacesService` must be instantiated using a map or a div element. | `Place` can be instantiated wherever needed, without a reference to a map or page element. |\n| `PlaceReview` returns attribution data for the review using the `author_name`, `author_url`, and `profile_photo_url` fields. | `Review` returns attribution data for the review using an [`AuthorAttribution`](/maps/documentation/javascript/reference/place#AuthorAttribution) instance. |\n\nCode comparison\n---------------\n\nThis section compares code for text search methods to illustrate the differences\nbetween Place reviews in the legacy `PlacesService` and the newer `Place` class.\n\n### Places service (legacy)\n\nThe following snippet calls `getDetails()` to request place details including\nreviews, and displays the first review result in an infowindow. \n\n const request = {\n placeId: \"ChIJpyiwa4Zw44kRBQSGWKv4wgA\", // Faneuil Hall Marketplace, Boston, MA\n fields: [\"name\", \"formatted_address\", \"geometry\", \"reviews\"],\n };\n const service = new google.maps.places.PlacesService(map);\n\n service.getDetails(request, (place, status) =\u003e {\n if (\n status === google.maps.places.PlacesServiceStatus.OK &&\n place &&\n place.geometry &&\n place.geometry.location\n ) {\n // If there are any reviews display the first one.\n if (place.reviews && place.reviews.length \u003e 0) {\n // Get info for the first review.\n let reviewRating = place.reviews[0].rating;\n let reviewText = place.reviews[0].text;\n let authorName = place.reviews[0].author_name;\n let authorUri = place.reviews[0].author_url;\n\n // Format the review using HTML.\n contentString =`\n \u003cdiv id=\"title\"\u003e\u003cb\u003e${place.name}\u003c/b\u003e\u003c/div\u003e\n \u003cdiv id=\"address\"\u003e${place.formatted_address}\u003c/div\u003e\n \u003ca href=\"${authorUri}\" target=\"_blank\"\u003eAuthor: ${authorName}\u003c/a\u003e\n \u003cdiv id=\"rating\"\u003eRating: ${reviewRating} stars\u003c/div\u003e\n \u003cdiv id=\"rating\"\u003e\u003cp\u003eReview: ${reviewText}\u003c/p\u003e\u003c/div\u003e`;\n } else {\n contentString = `No reviews were found for ${place.name}`;\n }\n\n const infowindow = new google.maps.InfoWindow({\n content: contentString,\n ariaLabel: place.displayName,\n });\n\n // Add a marker.\n const marker = new google.maps.Marker({\n map,\n position: place.geometry.location,\n });\n\n // Show the info window.\n infowindow.open({\n anchor: marker,\n map,\n });\n }\n });\n\n- [`getDetails()` reference](/maps/documentation/javascript/reference/places-service#PlacesService.getDetails)\n- [`PlaceReview` interface reference](/maps/documentation/javascript/reference/places-service#PlaceReview)\n\n### Place class (new)\n\nThe following snippet calls [`fetchFields()`](/maps/documentation/javascript/reference/place#Place.fetchFields)\nmethod to request place details including reviews, and displays the first review\nresult in an infowindow. \n\n // Use a place ID to create a new Place instance.\n const place = new google.maps.places.Place({\n id: \"ChIJpyiwa4Zw44kRBQSGWKv4wgA\", // Faneuil Hall Marketplace, Boston, MA\n });\n\n // Call fetchFields, passing 'reviews' and other needed fields.\n await place.fetchFields({\n fields: [\"displayName\", \"formattedAddress\", \"location\", \"reviews\"],\n });\n\n // If there are any reviews display the first one.\n if (place.reviews && place.reviews.length \u003e 0) {\n // Get info for the first review.\n let reviewRating = place.reviews[0].rating;\n let reviewText = place.reviews[0].text;\n let authorName = place.reviews[0].authorAttribution.displayName;\n let authorUri = place.reviews[0].authorAttribution.uri;\n\n // Format the review using HTML.\n contentString =`\n \u003cdiv id=\"title\"\u003e\u003cb\u003e${place.displayName}\u003c/b\u003e\u003c/div\u003e\n \u003cdiv id=\"address\"\u003e${place.formattedAddress}\u003c/div\u003e\n \u003ca href=\"${authorUri}\" target=\"_blank\"\u003eAuthor: ${authorName}\u003c/a\u003e\n \u003cdiv id=\"rating\"\u003eRating: ${reviewRating} stars\u003c/div\u003e\n \u003cdiv id=\"rating\"\u003e\u003cp\u003eReview: ${reviewText}\u003c/p\u003e\u003c/div\u003e`;\n } else {\n contentString = `No reviews were found for ${place.displayName}`;\n }\n\n // Create an infowindow to display the review.\n infoWindow = new google.maps.InfoWindow({\n content: contentString,\n ariaLabel: place.displayName,\n });\n\n // Add a marker.\n const marker = new google.maps.marker.AdvancedMarkerElement({\n map,\n position: place.location,\n title: place.displayName,\n });\n\n // Show the info window.\n infoWindow.open({\n anchor: marker,\n map,\n });\n\n- [See the example](/maps/documentation/javascript/examples/place-reviews)\n- [See the documentation](/maps/documentation/javascript/place-reviews)\n- [`fetchFields()` reference](/maps/documentation/javascript/reference/place#Place.fetchFields)\n- [`Review` class reference](/maps/documentation/javascript/reference/place#Review)"]]