تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
المطوّرون في المنطقة الاقتصادية الأوروبية
يمكن أن تعرض Places API معلومات تفصيلية حول مكان معيّن. توضّح هذه الصفحة الاختلافات بين تفاصيل المكان المستخدَمة في الفئة Place (الجديدة) والفئة PlacesService (القديمة)، وتقدّم بعض مقتطفات الرموز البرمجية للمقارنة. يسرد الجدول التالي بعض الاختلافات الرئيسية في استخدام تفاصيل المكان بين الفئة Place والفئة PlacesService:
يقارن هذا القسم بين جزأين متشابهَين من الرمز لتوضيح الاختلافات بين Places Service وفئة Place. تعرض مقتطفات الرموز البرمجية الرمز البرمجي المطلوب في كل واجهة برمجة تطبيقات معنية لتقديم طلب تفاصيل مكان، ثم استخدام بيانات المكان الناتجة لإضافة علامة إلى الخريطة.
خدمة "الأماكن" (الإصدار القديم)
يوضّح مقتطف الرمز المختصر التالي كيفية إرسال طلب تفاصيل مكان باستخدام
PlacesService. يستخدم الطلب دالة رد اتصال ويتضمّن عملية تحقّق شرطية مطلوبة بشأن PlacesServiceStatus. يتم تحديد حقول بيانات الأماكن المطلوبة في نص الطلب.
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,});}});}
يعرض مقتطف الرمز المختصر التالي كيفية إرسال طلب تفاصيل مكان باستخدام الفئة Place. الطلب غير متزامن، ولا يتضمّن عملية التحقّق من الحالة (يمكن استخدام معالجة الأخطاء العادية). يتم استخدام معرّف المكان لإنشاء مثيل Place جديد، ويتم استخدام هذا المثيل لتقديم الطلب (fetchFields()). ولا يتم تمرير حقول بيانات المكان المطلوبة إلا عند استدعاء fetchFields()، ما يوفّر مرونة أكبر. بما أنّ طريقة fetchFields() تستخدم عامل التشغيل await، لا يمكن استخدامها إلا داخل دالة 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,});}
تاريخ التعديل الأخير: 2025-09-05 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2025-09-05 (حسب التوقيت العالمي المتفَّق عليه)"],[],[],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)"]]