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

جلب الحقول

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

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

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

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

const { Map } = await google.maps.importLibrary("maps");
const { Place } = await google.maps.importLibrary("places");

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

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

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