تفاصيل المكان

اختيار النظام الأساسي: Android iOS JavaScript خدمة الويب

جلب الحقول

إذا كان لديك رقم تعريف حالي لكائن أو مكان على Place، استخدِم طريقة Place.fetchFields() للحصول على تفاصيل عن هذا المكان. أدخِل قائمة مفصولة بفواصل لتحديد حقول بيانات الأماكن المطلوب عرضها، وحدِّد أسماء الحقول بأسلوب "الترميز اللاتيني الكبير". استخدِم عنصر Place الذي تم إرجاعه للحصول على بيانات الحقول المطلوبة.

يستخدِم المثال التالي رقم تعريف مكان لإنشاء Place جديد، ويُطلِب Place.fetchFields() حقول displayName وformattedAddress، ويُضيف علامة إلى الخريطة، ويُسجِّل بعض البيانات في وحدة التحكّم.

TypeScript

async function getPlaceDetails() {
    const { Place } =  await google.maps.importLibrary("places") as google.maps.PlacesLibrary;
    const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
    // Use place ID to create a new Place instance.
    const place = new Place({
        id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg',
        requestedLanguage: 'en', // optional
    });

    // Call fetchFields, passing the desired 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 AdvancedMarkerElement({
        map,
        position: place.location,
        title: place.displayName,
    });
}
index.ts

JavaScript

async function getPlaceDetails() {
  const { Place } = await google.maps.importLibrary("places");
  const { AdvancedMarkerElement } = await google.maps.importLibrary("marker");
  // Use place ID to create a new Place instance.
  const place = new Place({
    id: "ChIJN5Nz71W3j4ARhx5bwpTQEGg",
    requestedLanguage: "en", // optional
  });

  // Call fetchFields, passing the desired 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 AdvancedMarkerElement({
    map,
    position: place.location,
    title: place.displayName,
  });
}

index.js
يُرجى العِلم أنّه تمّ الإعلان عن Map وPlace قبل هذه الدالة: 
const { Map } = await google.maps.importLibrary("maps");
const { Place } = await google.maps.importLibrary("places");
 الاطّلاع على المثال الكامل

استخدام المكوّن "نظرة عامة على المكان"

يعرض مكوّن "نظرة عامة على المكان" معلومات مفصّلة عن ملايين الأنشطة التجارية، بما في ذلك ساعات العمل والمراجعات بالنجوم والصور، بالإضافة إلى الاتجاهات وغيرها من الإجراءات في واجهة مستخدم مُعدّة مسبقًا بـ 5 أحجام وتنسيقات. وهو جزء من مكتبة المكوّنات الموسّعة، من "منصة خرائط Google"، وهي مجموعة من مكوّنات الويب التي تساعد المطوّرين في إنشاء خرائط أفضل وميزات موقع جغرافي بشكل أسرع.

استخدِم مُعدِّل "نظرة عامة على المكان" لإنشاء رمز قابل للتضمين لمكوّن "نظرة عامة على المكان" مخصّص، ثمّ صدِّره لاستخدامه مع إطارات العمل الشائعة مثل React وAngular أو بدون إطار عمل على الإطلاق.