迁移到新的地点详情
使用集合让一切井井有条
根据您的偏好保存内容并对其进行分类。
Places API 可以返回有关特定地点的详细信息。本页面介绍了 Place
类(新)和 PlacesService
(旧)中使用的地点详情之间的区别,并提供了一些代码段以供比较。下表列出了 Place
类和 PlacesService
在使用地点详情方面的一些主要区别:
代码比较
本部分将比较两段类似的代码,以说明 Places 服务与 Place 类之间的区别。这些代码段显示了每个相应 API 上发出地点详情请求所需的代码,然后使用生成的地点数据向地图添加标记。
地点服务(旧版)
以下简短的代码段展示了如何使用 PlacesService
发出地点详情请求。该请求使用回调,并包含对 PlacesServiceStatus
的必需条件检查。所需地点数据字段在请求正文中指定。
function getPlaceDetails() {
// Instantiate the Places Service.
const service = new google.maps.places.PlacesService(map);
// Make a request using the Place ID.
const request = {
placeId: "ChIJN1t_tDeuEmsRUsoyG83frY4",
fields: ["name", "formatted_address", "place_id", "geometry"],
};
// Request place details.
service.getDetails(request, (place, status) => {
// Check whether PlacesServiceStatus is OK.
if (
status === google.maps.places.PlacesServiceStatus.OK &&
place &&
place.geometry &&
place.geometry.location
) {
// Log the result.
console.log(place.name);
console.log(place.formatted_address);
// Add a marker for the place.
const marker = new google.maps.Marker({
map,
position: place.geometry.location,
title: place.name,
});
}
});
}
了解详情
地点类(新)
以下简短的代码段展示了如何使用 Place
类发出地点详情请求。请求是异步的,不包含状态检查(可以使用标准错误处理)。地点 ID 用于创建新的 Place
实例,该实例用于发出请求 (fetchFields()
)。在调用 fetchFields()
之前,不会传递所需的地点数据字段,这提供了更大的灵活性。由于 fetchFields()
方法使用了 await 运算符,因此只能在 async
函数内使用。
async function getPlaceDetails() {
// Use place ID to create a new Place instance.
const place = new google.maps.places.Place({
id: "ChIJN5Nz71W3j4ARhx5bwpTQEGg",
requestedLanguage: "en", // optional
});
// Call fetchFields, passing the needed data fields.
await place.fetchFields({
fields: ["displayName", "formattedAddress", "location"],
});
// Log the result.
console.log(place.displayName);
console.log(place.formattedAddress);
// Add an Advanced Marker.
const marker = new google.maps.marker.AdvancedMarkerElement({
map,
position: place.location,
title: place.displayName,
});
}
了解详情
如未另行说明,那么本页面中的内容已根据知识共享署名 4.0 许可获得了许可,并且代码示例已根据 Apache 2.0 许可获得了许可。有关详情,请参阅 Google 开发者网站政策。Java 是 Oracle 和/或其关联公司的注册商标。
最后更新时间 (UTC):2025-08-31。
[null,null,["最后更新时间 (UTC):2025-08-31。"],[],[],null,["# Migrate to the new Place Details\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\nThe Places API can return detailed information about a specific place. This page\nexplains the differences between place details as used in the `Place` class\n(new) and `PlacesService` (legacy), and provides some code snippets for\ncomparison. The following table lists some of the main differences in the use of\nplace details 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| [`getDetails()`](/maps/documentation/javascript/reference/places-service#PlacesService.getDetails) | [`fetchFields()`](/maps/documentation/javascript/reference/place#Place.fetchFields) |\n| [`PlaceDetailsRequest`](/maps/documentation/javascript/reference/places-service#PlaceDetailsRequest) | [`FetchFieldsRequest`](/maps/documentation/javascript/reference/place#FetchFieldsRequest) |\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| [Place data fields](/maps/documentation/javascript/place-data-fields) are formatted using snake case. | [Place data fields](/maps/documentation/javascript/place-class-data-fields) are formatted using camel case. |\n| Limited to a fixed set of [place types](/maps/documentation/javascript/supported_types) and [place data fields](/maps/documentation/javascript/place-data-fields). | Provides an expanded selection of regularly updated [place types](/maps/documentation/javascript/place-types) and [place data fields](/maps/documentation/javascript/place-class-data-fields). |\n\nCode comparison\n---------------\n\nThis section compares two similar pieces of code to illustrate the differences\nbetween the Places Service and the\nPlace class. The code snippets show the code\nrequired on each respective API to make a place details request, and then use\nthe resulting place data to add a marker to the map.\n\n### Places Service (Legacy)\n\nThe following condensed code snippet shows making a place details request using\n`PlacesService`. The request uses a callback, and includes a required\nconditional check on `PlacesServiceStatus`. The needed place data fields are\nspecified in the request body. \n\n function getPlaceDetails() {\n // Instantiate the Places Service.\n const service = new google.maps.places.PlacesService(map);\n\n // Make a request using the Place ID.\n const request = {\n placeId: \"ChIJN1t_tDeuEmsRUsoyG83frY4\",\n fields: [\"name\", \"formatted_address\", \"place_id\", \"geometry\"],\n };\n\n // Request place details.\n service.getDetails(request, (place, status) =\u003e {\n // Check whether PlacesServiceStatus is OK.\n if (\n status === google.maps.places.PlacesServiceStatus.OK &&\n place &&\n place.geometry &&\n place.geometry.location\n ) {\n\n // Log the result.\n console.log(place.name);\n console.log(place.formatted_address);\n\n // Add a marker for the place.\n const marker = new google.maps.Marker({\n map,\n position: place.geometry.location,\n title: place.name,\n });\n }\n });\n }\n\n#### Learn more\n\n- [See the complete code example](/maps/documentation/javascript/examples/place-details)\n- [Place Details](/maps/documentation/javascript/places#place_details) documentation\n- [`getDetails` reference](/maps/documentation/javascript/reference/places-service#PlacesService.getDetails)\n\n### Place class (New)\n\nThe following condensed code snippet shows making a place details request using\nthe `Place` class. The request is asynchronous, and does not include a status\ncheck (standard error handling can be used). A place ID is used to create a new\n`Place` instance, which is used to make the request (`fetchFields()`). The\nneeded place data fields are not passed until `fetchFields()` is called, which\nlends greater flexibility. Because the `fetchFields()` method uses the await\noperator it can only be used inside an `async` function. \n\n async function getPlaceDetails() {\n // Use place ID to create a new Place instance.\n const place = new google.maps.places.Place({\n id: \"ChIJN5Nz71W3j4ARhx5bwpTQEGg\",\n requestedLanguage: \"en\", // optional\n });\n\n // Call fetchFields, passing the needed data fields.\n await place.fetchFields({\n fields: [\"displayName\", \"formattedAddress\", \"location\"],\n });\n\n // Log the result.\n console.log(place.displayName);\n console.log(place.formattedAddress);\n\n // Add an Advanced Marker.\n const marker = new google.maps.marker.AdvancedMarkerElement({\n map,\n position: place.location,\n title: place.displayName,\n });\n }\n\n#### Learn more\n\n- [See the complete code example](/maps/documentation/javascript/examples/place-class)\n- [Place Details](/maps/documentation/javascript/place-details) documentation\n- [`fetchFields()` reference](/maps/documentation/javascript/reference/place#Place.fetchFields)"]]