Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Deweloperzy z Europejskiego Obszaru Gospodarczego (EOG)
Interfejs Places API może zwracać szczegółowe informacje o konkretnym miejscu. Na tej stronie wyjaśniamy różnice między szczegółami miejsca używanymi w klasie Place (nowej) i PlacesService (starszej) oraz podajemy fragmenty kodu do porównania. W tabeli poniżej znajdziesz niektóre z głównych różnic w używaniu szczegółów miejsca między klasą Place a PlacesService:
W tej sekcji porównujemy 2 podobne fragmenty kodu, aby zilustrować różnice między usługą Places a klasą Place. Fragmenty kodu pokazują kod wymagany w poszczególnych interfejsach API do wysłania żądania szczegółów miejsca, a następnie wykorzystują uzyskane dane o miejscu do dodania znacznika na mapie.
Usługa Miejsca (starsza wersja)
Poniższy skrócony fragment kodu pokazuje, jak wysłać żądanie szczegółów miejsca za pomocą PlacesService. Żądanie korzysta z wywołania zwrotnego i zawiera wymagane sprawdzenie warunkowe w przypadku PlacesServiceStatus. Wymagane pola danych o miejscu są określone w treści żądania.
functiongetPlaceDetails(){// Instantiate the Places Service.constservice=newgoogle.maps.places.PlacesService(map);// Make a request using the Place ID.constrequest={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.constmarker=newgoogle.maps.Marker({map,position:place.geometry.location,title:place.name,});}});}
Poniższy skrócony fragment kodu pokazuje, jak wysłać żądanie szczegółów miejsca za pomocą klasy Place. Żądanie jest asynchroniczne i nie obejmuje sprawdzania stanu (można użyć standardowej obsługi błędów). Identyfikator miejsca służy do tworzenia nowego wystąpienia Place, które jest używane do wysyłania żądania (fetchFields()). Wymagane pola danych o miejscu nie są przekazywane, dopóki nie zostanie wywołana funkcja fetchFields(), co zapewnia większą elastyczność. Metoda fetchFields() używa operatora await, więc można jej używać tylko w funkcji async.
asyncfunctiongetPlaceDetails(){// Use place ID to create a new Place instance.constplace=newgoogle.maps.places.Place({id:"ChIJN5Nz71W3j4ARhx5bwpTQEGg",requestedLanguage:"en",// optional});// Call fetchFields, passing the needed data fields.awaitplace.fetchFields({fields:["displayName","formattedAddress","location"],});// Log the result.console.log(place.displayName);console.log(place.formattedAddress);// Add an Advanced Marker.constmarker=newgoogle.maps.marker.AdvancedMarkerElement({map,position:place.location,title:place.displayName,});}
[[["Łatwo zrozumieć","easyToUnderstand","thumb-up"],["Rozwiązało to mój problem","solvedMyProblem","thumb-up"],["Inne","otherUp","thumb-up"]],[["Brak potrzebnych mi informacji","missingTheInformationINeed","thumb-down"],["Zbyt skomplikowane / zbyt wiele czynności do wykonania","tooComplicatedTooManySteps","thumb-down"],["Nieaktualne treści","outOfDate","thumb-down"],["Problem z tłumaczeniem","translationIssue","thumb-down"],["Problem z przykładami/kodem","samplesCodeIssue","thumb-down"],["Inne","otherDown","thumb-down"]],["Ostatnia aktualizacja: 2025-09-05 UTC."],[],[],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)"]]