借助地点评价,您可以向网页添加用户评价和评分。本页介绍了 Place
类(新版)和 PlacesService
(旧版)中使用的地点评价之间的区别,并提供了一些代码段以供比较。
- 如果请求中指定了
reviews
字段,PlacesService
(旧版)会针对任何getDetails()
请求返回PlaceResult
对象中的PlaceReview
实例数组。 - 如果请求中指定了
reviews
字段,Place
(新)会在fetchFields()
请求中返回一个Review
实例数组。
下表列出了 Place
类和 PlacesService
在使用地点评价方面的一些主要区别:
PlacesService (旧版) |
Place (新) |
---|---|
PlaceReview 接口 |
Review 类 |
方法需要使用回调来处理结果对象和 google.maps.places.PlacesServiceStatus 响应。 |
使用 Promise,并以异步方式运行。 |
方法需要进行 PlacesServiceStatus 检查。 |
无需状态检查,可以使用标准错误处理。 |
必须使用 Map 或 div 元素实例化 PlacesService 。 |
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()
方法来请求地点详细信息(包括评价),并在 Infowindow 中显示第一条评价结果。
// 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,
});