نظرة عامة
تتوفّر "منصة خرائط Google" على الويب (JS وTS) وAndroid وiOS، وتوفّر أيضًا واجهات برمجة تطبيقات لخدمات الويب للحصول على معلومات حول الأماكن والاتجاهات والمسافات. تمت كتابة النماذج في هذا الدليل لمنصة واحدة، ولكن تم توفير روابط المستندات لتنفيذها على منصات أخرى.
تتيح لك أداة Quick Builder في وحدة تحكّم Google Cloud إنشاء أداة بحث عن المتاجر بسرعة، بما في ذلك استيراد بيانات المتجر في "الملف التجاري" وتضمين روابط حجز المواعيد تلقائيًا من مقدّمي الخدمات التابعين لجهات خارجية. تتيح لك واجهة المستخدم التفاعلية إنشاء الرموز البرمجية ونشرها على السحابة الإلكترونية في غضون دقائق.
يريد المستخدمون البحث عن المنتجات والخدمات على الإنترنت والعثور على أفضل وأنسب مكان يمكنهم زيارته أو تحديد موعد فيه أو استلام طلبهم منه. سيريدون الوصول إلى موقعك الجغرافي بأسرع ما يمكن، وستسعى أنت إلى تقديم تجارب غنية على الإنترنت تزيد من الزيارات إلى مواقعك الجغرافية، وتعزّز رضا المستخدمين، وتقلّل من مكالمات الدعم. عليك أيضًا قياس مدى نجاح أداة البحث عن أماكن لمعرفة ما إذا كان بإمكان عملائك العثور على موقعك الجغرافي، ومعرفة الجوانب التي تحتاج إلى تحسُّن.
إنّ Locator Plus، أي النصائح حول الإرشاد والتخصيص التي نقدّمها في هذا المستند، هي ما ننصح به كأفضل مجموعة من واجهات برمجة التطبيقات في منصة خرائط Google لإنشاء تجارب رائعة للمستخدمين في أدوات البحث عن أماكن. باتّباع هذه الممارسات، يمكنك مساعدة المستخدمين في العثور على مواقعك الجغرافية على الخريطة، والاطّلاع على المعلومات التفصيلية التي يحتاجون إليها لاتّخاذ القرارات، والحصول على الاتجاهات، سواء كانوا يقودون السيارة أو يركبون الدراجة أو يمشون أو يستخدمون وسائل النقل العام.
بالنسبة إلى مستخدمي Locator Plus، تساعدك لوحة بيانات الإحصاءات في تحليل بياناتك وإنشاء إحصاءات منها، ما يمنحك صورة واضحة عن مدى تفاعل المتسوّقين مع أداة البحث عن المتاجر. للوصول إلى هذا التقرير، انتقِل إلى قسم تقارير التفاعل في وحدة التحكّم. لمزيد من التفاصيل حول هذا التقرير، يُرجى الاطّلاع على تقارير التفاعل.
يوضّح المخطّط التالي واجهات برمجة التطبيقات الأساسية المعنية بتنفيذ Locator Plus. يعرض المخطّط أيضًا قاعدة بيانات خاصة ببيانات الموقع الجغرافي يمكنك دمجها مع خدمة "تفاصيل المكان" لتزويد المستخدمين بأفضل مجموعة معلومات ممكنة وأكثرها شمولاً. (انقر للتكبير.)
تفعيل واجهات برمجة التطبيقات
لتنفيذ هذه الممارسات، يجب تفعيل واجهات برمجة التطبيقات التالية في Google Cloud Console: لمزيد من المعلومات حول عملية الإعداد، يُرجى الاطّلاع على مقالة بدء استخدام "منصة خرائط Google".أقسام التنفيذ
في ما يلي الممارسات وعمليات التخصيص التي سنتناولها في هذا المستند.
- رمز علامة الاختيار هو ممارسة أساسية.
- إنّ رمز النجمة هو تخصيص اختياري، ولكن يُنصح به لتحسين الحلّ.
| عرض مواقعك الجغرافية على خريطة تفاعلية |
إنشاء خريطة تتيح للمستخدمين الاطّلاع على تفاصيل الموقع الجغرافي والتنقّل وتكبير الخريطة وتصغيرها أو يمكنك استكشاف حلّ Quick Builder Locator Plus لإنشاء خريطة بسرعة، بما في ذلك استيراد تفاصيل النشاط التجاري من بطاقات بيانات الملف التجاري وتضمين روابط حجز المواعيد ونشرها على Google Cloud Storage. |
|
| توفير تفاصيل الأماكن | بعد أن يعثر المستخدمون على أقرب مواقعك الجغرافية على الخريطة، قدِّم لهم تفاصيل المكان حول هذه المواقع لمساعدتهم في اتخاذ القرارات. | |
| عرض المواقع الجغرافية من زاوية 45 درجة | يمكنك منح المستخدمين عرضًا مرئيًا أفضل لموقعك الجغرافي في "عرض القمر الصناعي" من زاوية 45 درجة. | |
| تحديد الموقع الجغرافي للمستخدم | أضِف وظيفة "الكتابة أثناء التنقل" لتحسين تجربة المستخدم على جميع المنصات وتحسين دقة العناوين بأقل عدد من ضغطات المفاتيح. | |
| عرض مدة الرحلة والمسافة إلى أقرب المواقع الجغرافية | حساب مسافة السفر ومدة السفر لعدة نقاط انطلاق ووجهات، مع إمكانية تحديد أشكال مختلفة من وسائل النقل، مثل المشي أو القيادة أو ركوب الدراجات | |
| مساعدة المستخدمين في حجز المواعيد |
السماح للمستخدمين بحجز موعد من اللوحة الجانبية "تفاصيل المكان" أو يمكنك استكشاف حلّ Quick Builder Locator Plus لإنشاء خريطة بسرعة، بما في ذلك استيراد تفاصيل النشاط التجاري من بطاقات بيانات الملف التجاري وتضمين روابط حجز المواعيد ونشرها على Google Cloud Storage. |
|
| عرض العروض المحلية | عرض عروض محلية قابلة للنقر في اللوحة الجانبية "تفاصيل المكان" | |
| توفير اتجاهات التنقّل | الحصول على بيانات الاتجاهات من نقطة الانطلاق إلى الوجهة باستخدام وسائل نقل مختلفة، مثل المشي والقيادة وركوب الدراجة ووسائل النقل العام | |
| تخصيص الخريطة | يمكنك إنشاء علامات مخصّصة على الخريطة لمساعدة مواقعك الجغرافية في التميّز، وتصميم الخريطة لتتطابق مع ألوان علامتك التجارية. يمكنك عرض (أو إخفاء) نقاط اهتمام معيّنة على خريطتك لمساعدة المستخدمين في تحديد مواقعهم بشكل أفضل، والتحكّم في كثافة نقاط الاهتمام لمنع تكدّس العناصر على الخريطة. | |
| الحصول على إحصاءات حول الاستخدام | ضبط "إحصاءات Google" واستخدامها للحصول على إحصاءات حول استراتيجية أداة البحث عن أماكن وتنفيذها | |
| إرسال الاتجاهات إلى الجهاز الجوّال | بالإضافة إلى عرض الاتجاهات على أداة البحث عن أماكن، يمكنك أيضًا إرسال الاتجاهات إلى هاتف المستخدم للتنقّل باستخدام "خرائط Google" أثناء التنقّل. | |
| عرض صور "التجوّل الافتراضي" لمساعدة المستخدمين في تصوّر المواقع الجغرافية | قدِّم للمستخدمين صورًا من "التجوّل الافتراضي" بزاوية 360 درجة لمساعدتهم في تحديد الاتجاهات والعثور على مواقعك الجغرافية بشكل أسرع. | |
| تحديد الموقع الجغرافي للمستخدم باستخدام ميزة "رصد الموقع الجغرافي" | إذا كنت لا تريد الاعتماد على خدمات الموقع الجغرافي على الجهاز، استخدِم Geolocation للمساعدة في تحديد الموقع الجغرافي للمستخدم. | |
| الجمع بين بيانات الموقع الجغرافي المخصّصة و"تفاصيل المكان" | يمكنك الجمع بين تفاصيل الموقع الجغرافي المخصّصة و"تفاصيل المكان" لتزويد المستخدمين بمجموعة غنية من البيانات لاتخاذ القرارات. |
عرض مواقعك الجغرافية على خريطة تفاعلية
يُعدّ أداة البحث عن أماكن جزءًا مهمًا من تجربة المستخدم. ومع ذلك، قد لا تتضمّن بعض المواقع الإلكترونية خريطة، ما يضطر المستخدمين إلى مغادرة الموقع الإلكتروني أو التطبيق للعثور على موقع جغرافي قريب. وهذا يعني أنّ المستخدمين سيحصلون على تجربة غير مثالية لأنّهم سيضطرون إلى التنقّل بين الصفحات للحصول على المعلومات التي يحتاجون إليها. بدلاً من ذلك، يمكنك تحسين هذه التجربة من خلال تضمين الخرائط وتخصيصها في تطبيقاتك.
يمكنك تفعيل هذه الوظيفة بطريقتَين: باستخدام حلّ Quick Builder Locator Plus لتوفيرها بدون أي إعدادات إضافية، أو باستخدام عملية التنفيذ الخاصة بك في Dynamic Maps. يوضّح هذا القسم هذه الخيارات بالتفصيل.
استخدام أداة الإنشاء السريع في Locator Plus
يمكنك استخدام حلّ Quick Builder Locator Plus لاستيراد تفاصيل النشاط التجاري من ملفك التجاري. وبالتالي، سيظهر أي تغيير في تفاصيل نشاطك التجاري في "الملف التجاري" في أداة البحث عن المتاجر على موقعك الإلكتروني. يمكن أن تشمل هذه التغييرات ساعات العمل ومعلومات الاتصال والصور وخيارات الخدمة وغير ذلك. يمكن أن يتيح لك Quick Builder استكشاف إعداد مواقع الأنشطة التجارية على الخريطة بسرعة، أو إنشاء رمز برمجي قابل للنشر، أو النشر مباشرةً على Google Cloud Storage في غضون دقائق.
استخدام عملية التنفيذ الخاصة بك لـ "الخرائط الديناميكية"
| يستخدم هذا المثال: Maps JavaScript API | تتوفّر أيضًا على: Android | iOS |
يمكنك إضافة خريطة ديناميكية إلى صفحتك، أي خريطة يمكن للمستخدمين التنقّل فيها وتكبيرها وتصغيرها والحصول على تفاصيل حول المواقع الجغرافية المختلفة ونقاط الاهتمام، وذلك باستخدام بضعة أسطر من الرموز البرمجية.
يجب أولاً تضمين Maps JavaScript API في الصفحة.
يتم ذلك من خلال ربط النص البرمجي التالي في صفحة HTML، بما في ذلك libraries=marker، حتى تتمكّن من إضافة علامات متقدّمة إلى الخريطة.
<script defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=marker&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a"></script>
يشير عنوان URL إلى دالة JavaScript initMap التي يتم تشغيلها عند تحميل الصفحة. في عنوان URL، يمكنك أيضًا تحديد لغة أو منطقة الخريطة للتأكّد من تنسيقها بالطريقة الصحيحة للبلد المحدّد الذي تستهدفه. يضمن تحديد منطقة أيضًا أن يكون سلوك التطبيقات المستخدَمة خارج الولايات المتحدة متحيزًا للمنطقة التي تحدّدها. يمكنك الاطّلاع على
تفاصيل التغطية في "منصة خرائط Google"
للحصول على القائمة الكاملة باللغات والمناطق المتاحة، والتعرّف على المزيد حول
region
استخدام المَعلمات.
بعد ذلك، تحتاج إلى عنصر HTML div لوضع الخريطة على الصفحة.
هذا هو المكان الذي ستظهر فيه الخريطة.
<div id="map"></div>
الخطوة التالية هي ضبط الوظائف الأساسية للخريطة. يتم ذلك في دالة النص البرمجي initMap المحدّدة في عنوان URL للنص البرمجي. في هذا النص البرمجي،
الموضّح في المثال التالي، يمكنك ضبط الموقع الجغرافي الأوّلي ومعرّف الخريطة (مطلوب
للعلامات المتقدّمة وتصميم الخرائط المستند إلى السحابة الإلكترونية)،
نوع الخريطة،
وعناصر التحكّم التي ستكون متاحة على الخريطة للمستخدمين. لاحظ أنّ getElementById() يشير إلى معرّف div "الخريطة" في المثال السابق.
function initMap() { const map = new google.maps.Map(document.getElementById("map"), { zoom: 12, center: { lat: 51.485925, lng: -0.129500 }, mapId: "DEMO_MAP_ID", zoomControl: false }); }
بالنسبة إلى أداة البحث عن أماكن، يهمّك عادةً ضبط الموقع الجغرافي الأوّلي ونقطة مركزية أو الحدود ومستوى التكبير (مقدار تكبير الخريطة في ذلك الموقع الجغرافي). معظم العناصر الأخرى، مثل ضبط عناصر التحكّم، اختيارية لأنّك تحدّد مستوى التفاعل مع الخريطة.
الحصول على أرقام تعريف الأماكن
| يستخدم هذا المثال: Places API (جديدة) | يتوفّر أيضًا: JavaScript |
من المحتمل أن يكون لديك قاعدة بيانات خاصة بمواقعك الجغرافية تتضمّن معلومات أساسية، مثل اسم الموقع الجغرافي وعنوانه ورقم هاتفه. لاسترداد المعلومات التي توفّرها منصة Google Maps
عن هذا المكان، بما في ذلك الإحداثيات الجغرافية والمعلومات التي يقدّمها المستخدمون، ابحث عن رقم تعريف المكان
المناسب لكل موقع جغرافي في قاعدة البيانات. يمكنك إجراء طلب إلى
نقطة نهاية "البحث النصي (جديد)" في Places API (جديد) وطلب الحقل places.id فقط في قناع الحقل (ما يؤدي إلى تفعيل رمز التخزين التعريفي "أساسيات البحث النصي" فقط).
في ما يلي مثال على طلب معرّف المكان لمكتب Google في لندن:
curl -X POST -d '{
"textQuery" : "Google London"
}' \
-H 'Content-Type: application/json' \
-H 'X-Goog-Api-Key: YOUR_API_KEY' \
-H 'X-Goog-FieldMask: places.id' \
'https://places.googleapis.com/v1/places:searchText'يمكنك تخزين معرّف المكان هذا في قاعدة البيانات واستخدامه كطريقة فعّالة لطلب معلومات عن المكان. في ما يلي تعليمات حول استخدام معرّف المكان لتحديد الموقع الجغرافي واسترداد تفاصيل المكان وطلب اتجاهات إلى المكان.
الترميز الجغرافي لمواقعك الجغرافية
| يستخدم هذا المثال: Geocoding API | يتوفّر أيضًا: JavaScript |
إذا كانت قاعدة بيانات المواقع الجغرافية تتضمّن عناوين شوارع ولكن ليس إحداثيات جغرافية، استخدِم Geocoding API للحصول على خط العرض وخط الطول الخاصين بهذا العنوان لأغراض وضع العلامة على الخريطة. يمكنك تحويل العناوين إلى رموز جغرافية من جهة الخادم، وتخزين خطوط الطول ودوائر العرض في قاعدة البيانات، ثم تحديثها كل 30 يومًا على الأقل.
في ما يلي مثال على استخدام Geocoding API للحصول على خط العرض وخط الطول الخاصَين برقم تعريف المكان الذي تم عرضه لمكتب Google في لندن:
https://maps.googleapis.com/maps/api/geocode/json?place_id=ChIJVSZzVR8FdkgRTyQkxxLQmVU&key=YOUR_API_KEY&solution_channel=GMP_guides_locatorplus_v2_aإضافة مواقع جغرافية إلى الخريطة
الخطوة التالية هي إضافة مواقعك الجغرافية إلى الخريطة. يتم ذلك عادةً من خلال إضافة علامات متقدّمة إلى الخريطة، ولكن هناك عدد من الخيارات الأخرى التي يمكنك استخدامها، مثل طبقات البيانات.
بعد الحصول على خط العرض وخط الطول لموقعك الجغرافي، إليك مثال على إضافة علامة متقدّمة تتضمّن حرفًا رسوميًا نصيًا مخصّصًا إلى الخريطة:
const pin = new google.maps.marker.PinElement({ glyphText: "A", }); const marker = new google.maps.marker.AdvancedMarkerElement({ map, position: { lat: 51.493073, lng: -0.146550 }, title: "Location Name", }); marker.append(pin);
باستخدام بعض العلامات، يمكنك الاطّلاع على الموقع الجغرافي لعدد من المواقع الجغرافية معًا.
إذا كان عدد المواقع الجغرافية كبيرًا، يمكنك استخدام أداة تجميع العلامات في JavaScript أو Android أو iOS. في ما يلي مثال على تجميع العلامات في عيّنة أداة تحديد الموقع الجغرافي للمتجر المستندة إلى JavaScript على GitHub.
توفير تفاصيل المكان
| يستخدم هذا المثال: Maps JavaScript API | تتوفّر أيضًا: Places API (جديد) | Android | iOS |
يمكنك مشاركة تفاصيل المكان التي يحتاج المستخدمون إلى معرفتها قبل زيارة أحد مواقعك الجغرافية. من خلال ميزة "تفاصيل المكان" المنسّقة، مثل معلومات الاتصال وساعات العمل وتقييمات المستخدمين وصور المستخدمين وحالة الإغلاق المؤقت، سيعرف المستخدمون بالضبط ما يمكن توقّعه عند زيارة موقعك الجغرافي. بعد إجراء طلب إلى Places API (New)، يمكنك فلترة الرد وعرضه في نافذة معلومات أو شريط جانبي على الويب أو بأي طريقة أخرى تريدها.
لطلب تفاصيل المكان، ستحتاج إلى معرّف المكان لكل موقع من مواقعك الجغرافية. اطّلِع على الحصول على معرّفات الأماكن لاسترداد معرّف المكان الخاص بموقعك الجغرافي.
وسِّع القائمة للاطّلاع على فيديوهات لطلب تفاصيل المكان:
الحصول على ساعات العمل
التحقّق من حالات الإغلاق
التحكّم في التكاليف
يستخدم المثال التالي فئة Place في مكتبة الأماكن، Maps JavaScript API لاسترداد تفاصيل المكان وإضافتها إلى InfoWindow. يستخدم هذا التنفيذ استراتيجية توفير التكاليف من خلال تفعيل طلب "تفاصيل المكان" فقط عندما يطلب المستخدم التفاصيل بالنقر على العلامة بدلاً من جلب التفاصيل بشكل استباقي لجميع المواقع الجغرافية بغض النظر عن اهتمام المستخدم.
const marker = new google.maps.marker.AdvancedMarkerElement({ map, position: { lat: 51.493073, lng: -0.14655 }, gmpClickable: true, }); const place = new google.maps.places.Place({ id: "ChIJVSZzVR8FdkgRTyQkxxLQmVU", }); const infowindow = new google.maps.InfoWindow(); marker.addEventListener("gmp-click", async () => { await place.fetchFields({ fields: ["displayName", "formattedAddress", "rating", "websiteURI"], }); infowindow.setContent( "<div><strong>" + place.displayName + "</strong><br>" + place.formattedAddress + "<br>" + "Rating: " + place.rating + " stars<br>" + place.websiteURI + "</div>" ); infowindow.open({ map, anchor: marker, }); });
عرض المواقع الجغرافية من زاوية 45 درجة
| يستخدم هذا المثال: Maps JavaScript API | تتوفّر أيضًا على: Android | iOS |
يساعد عرض تصوير جوّي لموقعك الجغرافي المستخدمين في تكوين فكرة أوضح عن شكله، ما يسهّل عليهم العثور عليه. عندما يختار المستخدم موقعًا جغرافيًا واحدًا للاطّلاع على مزيد من التفاصيل، يمكنك تكبير هذا الموقع الجغرافي لعرض صور الأقمار الصناعية المتوفّرة من زاوية 45 درجة.
تضبط عينة التعليمات البرمجية التالية الخريطة على مستوى تكبير عالٍ ونوع خريطة متوافق وزاوية ميل تعرض صورًا بزاوية 45 درجة إذا كانت متاحة. تتوفّر تفاصيل حول مدى توفّر صور بزاوية 45 درجة في المستندات.
function seeDetail(location) {
map.setCenter(location);
map.setZoom(19);
map.setMapTypeId(google.maps.MapTypeId.HYBRID);
map.setTilt(45);
}إعادة ضبط وضع الخريطة الأصلي
يريد المستخدمون غالبًا التبديل بين العرض التفصيلي لموقع جغرافي واحد والعرض الموجز لعدة مواقع جغرافية قريبة. لتسهيل ذلك، أضِف أداة معالجة الأحداث لرصد الوقت الذي يغادر فيه المستخدم عرض التفاصيل، سواء كان ذلك من خلال التفاعل مع الخريطة أو في عرض القائمة. على سبيل المثال، يشير الاستماع إلى الحدث zoom_changed على العنصر map إلى أنّ المستخدم إما صغّر العرض يدويًا من العرض التفصيلي أو استدعى دالة أخرى عدّلت مستوى التكبير/التصغير. في هذا المثال، يؤدي التصغير إلى إعادة ضبط الخريطة على نوع الخريطة الأصلي وزاوية الميل الأصلية.
let originalMapTypeId = google.maps.MapTypeId.ROADMAP; map.addListener("zoom_changed", () => { const newZoom = map.getZoom()!; if (newZoom < 19) { map.setTilt(0); map.setMapTypeId(originalMapTypeId); } });
تحديد الموقع الجغرافي للمستخدم
| يستخدم هذا المثال: Maps JavaScript API | تتوفّر أيضًا على: Android | iOS |
المكوّن الرئيسي التالي في أي أداة البحث عن أماكن هو تحديد الموقع الجغرافي الأوّلي للمستخدم. بشكلٍ تلقائي، ستتمكّن من استخدام خدمات الموقع الجغرافي على الأجهزة الجوّالة وتحديد الموقع الجغرافي في متصفّح الويب لطلب أذونات المستخدمين لضبط الموقع الجغرافي الحالي للمستخدم كموقع جغرافي أساسي. ومع ذلك، قد يرفض المستخدم منح هذه الأذونات أو قد يريد تحديد موقع جغرافي مختلف كنقطة بداية.
اعتاد المستخدمون اليوم على وظيفة "الإكمال التلقائي" في الإصدار المخصّص للمستهلكين من "خرائط Google". يمكن دمج هذه الوظيفة في أي تطبيق باستخدام مكتبات الأماكن في منصة خرائط Google على الأجهزة الجوّالة والويب. عندما يكتب المستخدم عنوانًا، تملأ ميزة "الإكمال التلقائي" بقية المعلومات باستخدام أدوات. يمكنك أيضًا توفير وظيفة الإكمال التلقائي الخاصة بك باستخدام Place Autocomplete Data API مباشرةً.
ما عليك سوى إضافة بضع معلَمات طلب بحث إلى عنوان URL لبرنامج نصي Maps JavaScript API لإضافة مكتبة الإكمال التلقائي للأماكن إلى موقعك الإلكتروني. في المثال التالي، تكون الإضافة libraries=places,marker.
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places,marker&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a" defer></script>
بعد ذلك، أضِف عنصر حاوية إلى صفحتك حيث سيتم إلحاق أداة
PlaceAutocompleteElement.
<div id="autocomplete-container"></div>
أخيرًا، عليك تهيئة أداة PlaceAutocompleteElement وإلحاقها بالحاوية. يؤدي تقييد توقّعات الإكمال التلقائي للأماكن باستخدام includedPrimaryTypes: ["geocode"] إلى ضبط الأداة للسماح بقبول عناوين الشوارع والأحياء والمدن والرموز البريدية، ما يتيح للمستخدمين إدخال أي مستوى من التفاصيل لوصف مصدرهم. عندما يختار المستخدم توقعًا، يتم تنشيط الحدث gmp-select ويمكنك استدعاء place.fetchFields() لطلب الحقل location الذي يحتوي على خطوط الطول والعرض لموقع المستخدم الأصلي. ستستخدم إحداثيات الخريطة هذه لإعادة توسيط الخريطة وتحديد العلاقة بين مواقعك الجغرافية والموقع الأصلي.
// Create the PlaceAutocompleteElement, restricting predictions to // geographical location types in the United Kingdom. const placeAutocomplete = new google.maps.places.PlaceAutocompleteElement({ includedPrimaryTypes: ["geocode"], includedRegionCodes: ["gb"], }); placeAutocomplete.placeholder = "Enter starting address, city, or zip code"; document.getElementById("autocomplete-container").appendChild(placeAutocomplete); // When the user selects an address from the drop-down, // zoom to the selected location and add an advanced marker. placeAutocomplete.addEventListener("gmp-select", async ({ placePrediction }) => { const place = placePrediction.toPlace(); await place.fetchFields({ fields: ["location", "formattedAddress"], }); addUserLocation(place); }); }
في هذا المثال، بعد أن يختار المستخدم العنوان، يتم تنفيذ الدالة addUserLocation(). يؤدي ذلك إلى أخذ الموقع الجغرافي للنتيجة المطابقة، ونقل الخريطة إلى ذلك الموقع الجغرافي، وإضافة علامة متقدّمة.
function addUserLocation(place) { const pin = new google.maps.marker.PinElement({ glyphText: "C", }); // Add an advanced marker to the map. const marker = new google.maps.marker.AdvancedMarkerElement({ map, position: place.location, }); marker.append(pin); // Pan and zoom the map to the marker. map.panTo(place.location); map.setZoom(12); }
يمكنك بعد ذلك الاطّلاع على العلاقة بين المستخدم وأي مواقع جغرافية معيّنة، كما هو موضّح في الصورة التالية.
وسِّع هذا القسم للاطّلاع على فيديوهات توضيحية حول كيفية إضافة ميزة "الإكمال التلقائي" الخاصة بـ Place إلى تطبيقك:
الموقع الإلكتروني
تطبيقات Android
تطبيقات iOS
عرض مدة الرحلة والمسافة إلى أقرب المواقع الجغرافية
| يستخدم هذا المثال ما يلي: Routes API | تتوفّر أيضًا: Routes Library وMaps JavaScript API |
بعد الحصول على الموقع الجغرافي للمستخدم، يمكنك مقارنته بالمواقع الجغرافية التي تستهدفها. سيساعدك إجراء ذلك باستخدام ميزة
Compute Route Matrix في
Routes API (أو الفئة RouteMatrix
في Routes Library، Maps JavaScript API) في
مساعدة المستخدمين على اختيار الموقع الجغرافي الأنسب لهم حسب مدة القيادة أو المسافة على الطريق.
يشير عرض المواقع الجغرافية القريبة من المستخدم إلى أنّك قد أضفت مواقعك الجغرافية. عند استخدام قاعدة بيانات خاصة بالمواقع الجغرافية، يجب التأكّد من أنّ البيانات بالتنسيق الذي يمكن استخدامه في الخريطة، مثل GeoJSON، كما هو موضّح في موضوع طبقة البيانات.
الطريقة العادية لتنظيم قائمة بالمواقع الجغرافية هي ترتيبها حسب المسافة. في كثير من الأحيان، يتم احتساب هذه المسافة باستخدام الخط المستقيم من المستخدم إلى الموقع الجغرافي، ولكن قد يكون ذلك مضلّلاً. قد يمر الخط المستقيم فوق نهر لا يمكن عبوره أو عبر طرق مزدحمة في وقت قد يكون فيه موقع جغرافي آخر أكثر ملاءمة. هذا الإجراء مهم إذا كانت لديك مواقع جغرافية متعددة تقع على بُعد بضعة كيلومترات من بعضها البعض.
تعمل الطريقة computeRouteMatrix من خلال أخذ قائمة بالمواقع الجغرافية للمصدر والوجهة، ولا تعرض فقط مسافة التنقّل، بل تعرض أيضًا وقت التنقّل بينها. في حالة المستخدم، سيكون المصدر هو موقعه الجغرافي الحالي أو نقطة البداية المفضّلة لديه، وستكون الوجهات هي المواقع الجغرافية.
يمكن تحديد نقاط البداية والوجهات كأزواج إحداثيات أو معرّفات أماكن أو عناوين. يمكنك استخدام
computeRouteMatrix مع الإعدادات المفضَّلة لتحديد أفضل مسار، مثل TRAFFIC_AWARE
لعرض النتائج استنادًا إلى مدّة القيادة الحالية أو المستقبلية.
يستدعي المثال التالي نقطة النهاية computeRouteMatrix في Routes API،
ويحدّد نقطة انطلاق المستخدم ومعرّفات الأماكن الخاصة بالوجهة. يحسب هذا المثال المسافة ومدة الرحلة من مركز الخريطة إلى ثلاثة مكاتب تابعة لشركة Google في لندن:
curl -X POST -d '{
"origins": [
{
"waypoint": {
"location": {
"latLng": {
"latitude": 51.493490,
"longitude": -0.097288
}
}
}
}
],
"destinations": [
{
"waypoint": {
"placeId": "ChIJVSZzVR8FdkgRTyQkxxLQmVU"
}
},
{
"waypoint": {
"placeId": "ChIJVSZzVR8FdkgR-HklrBMO0Hc"
}
},
{
"waypoint": {
"placeId": "ChIJ4abvVDwbdkgRDZVFR7A6Bcc"
}
}
],
"travelMode": "DRIVE",
"routingPreference": "TRAFFIC_AWARE"
}' \
-H 'Content-Type: application/json' \
-H 'X-Goog-Api-Key: YOUR_API_KEY' \
-H 'X-Goog-FieldMask: originIndex,destinationIndex,duration,distanceMeters,status,condition' \
'https://routes.googleapis.com/distanceMatrix/v2:computeRouteMatrix'تحتوي الاستجابة من الخدمة على المسافة (بالمتر) والمدة لكل زوج من نقاط البداية والنهاية، على غرار ما هو موضّح في المثال التالي:
وسِّع القسم للاطّلاع على نموذج الردّ:
[
{
"originIndex": 0,
"destinationIndex": 0,
"status": {},
"distanceMeters": 4540,
"duration": "924s",
"condition": "ROUTE_EXISTS"
},
{
"originIndex": 0,
"destinationIndex": 1,
"status": {},
"distanceMeters": 5043,
"duration": "1044s",
"condition": "ROUTE_EXISTS"
},
{
"originIndex": 0,
"destinationIndex": 2,
"status": {},
"distanceMeters": 6919,
"duration": "1357s",
"condition": "ROUTE_EXISTS"
}
]تعرض الصورة التالية نقطة الانطلاق (العلامة الحمراء C) والوجهات على خريطة:
يختلف قياس المسافة بخط مستقيم عن قياس مسافة الطريق، كما هو موضّح في الجدول التالي.
| الموقع الجغرافي | المسافة المستقيمة | الطريق في الازدحام / الوقت |
|---|---|---|
| الموقع الجغرافي (أ) | 3.32 كلم | 4.5 كم / 15 دقيقة |
| الموقع الجغرافي (ب) | 3.20 كم | 5.0 كم / 17 دقيقة |
| الموقع الجغرافي (ج) | 4.84 كم | 6.9 كم / 23 دقيقة |
على الرغم من أنّ الموقع الجغرافي (ب) هو الأقرب من حيث المسافة، إلا أنّ المسار والوقت اللازمَين للوصول إليه أطول لأنّه يمكن الوصول إلى الموقع الجغرافي (أ) عبر طريق سريع.
بعد تقديم هذا الطلب، يمكنك معالجة المطابقة لترتيب الردود حسب مدة وقت القيادة. يمكنك العثور على أمثلة لهذه الدالة في درس تطبيقي حول الترميز الخاصة بأداة البحث عن أماكن.
توفير اتجاهات التنقّل
| يستخدم هذا المثال: Routes Library وMaps JavaScript API | تتوفّر أيضًا: Routes API خدمة ويب يمكن استخدامها على Android وiOS، إما مباشرةً من التطبيق أو عن بُعد من خلال خادم وكيل |
عند عرض الاتجاهات للمستخدمين من داخل موقعك الإلكتروني أو تطبيقاتك، لن يحتاجوا إلى الانتقال إلى موقع آخر، ما يعني أنّهم لن يتشتّت انتباههم بصفحات أخرى أو يروا المنافسين على الخريطة. باستخدام Routes API، يمكنك أيضًا طلب مسارات صديقة للبيئة لتقدير استهلاك الوقود أو الطاقة وعرض التأثير البيئي للرحلة.
يحتوي صف Route
في حزمة تطوير البرامج (SDK) الخاصة بخدمة "المسارات"، Maps JavaScript API أيضًا على طرق، مثل createPolylines()
وcreateWaypointAdvancedMarkers()، تتيح لك معالجة النتائج
وعرضها على خريطة.
في ما يلي مثال على طلب مسار وعرضه على خريطة. لمزيد من المعلومات حول العيّنة، يُرجى الاطّلاع على الحصول على مسار.
لمزيد من المعلومات حول ميزات "خرائط Google" هذه، يمكنك قراءة مستندات Maps JavaScript API أو الاطّلاع على الدرس التطبيقي حول الترميز الذي يقدّم إرشادات تدريجية حول كيفية إنشاء أداة البحث عن أماكن.
مساعدة المستخدمين في حجز المواعيد
عندما يعرض المستخدمون "تفاصيل المكان" الخاصة بموقعك الجغرافي في لوحة جانبية، يمكنك توفير ميزة حجز موعد بنقرة زر، كما هو موضّح في الشكل التالي.
هناك عدة طرق لتفعيل هذه الميزة: (1) استخدام حلّ Quick Builder Locator Plus لتوفير هذه الوظيفة بشكل جاهز، و (2) استخدام الملف التجاري. يوضّح هذا القسم هذه الخيارات بالتفصيل.
استخدام أداة الإنشاء السريع في Locator Plus
يمكنك استخدام حلّ Quick Builder Locator Plus لاستيراد تفاصيل المؤسسة بسرعة من ملفك التجاري. بعد استيراد البيانات إلى أداة "الإنشاء السريع"، يمكنك تفعيل روابط حجز المواعيد المضمّنة، حيثما كان ذلك متاحًا، للمواقع الجغرافية لنشاطك التجاري باستخدام الحجز عبر Google. حتى إذا لم يكن لديك ملف تجاري مرتبط بحساب Google، سيظل بإمكانك استخدام "المنشئ السريع" لتضمين روابط حجز للمؤسسات التي سبق لك تفعيلها من خلال مقدّمي خدمات الحجز التابعين لجهات خارجية عبر "الحجز عبر Google"*.
*لا تتوفّر ميزة "الحجز عبر Google" إلا في بلدان/مناطق معيّنة تتعامل فيها الأنشطة التجارية مع موفّر خدمة حجوزات معتمَد. إذا كنت مهتمًا بالانضمام إلى برنامج "الحجز عبر Google" ولكنّك لا تتعامل مع أحد شركاء البرنامج، يمكنك توجيه مقدّم الخدمة إلى إرسال نموذج إبداء الاهتمام من خلال ملء نموذج إبداء الاهتمام هذا والاطّلاع على المستندات لمعرفة كيفية البدء. إذا لم تكن تتعامل مع مقدّم خدمة لإدارة حجوزاتك، يمكنك الاطّلاع على مقدّمي الخدمات المؤهّلين في قسم "الحجوزات" ضمن لوحة إدارة الملفات التجارية.
استخدام "الملف التجاري" لإتاحة حجز المواعيد
عند إدارة حضورك على الإنترنت باستخدام الملف التجاري، يتم ربط المواقع الجغرافية للنشاط التجاري التي تنشئها بمعرّفات الأماكن على منصة خرائط Google لتفعيل وظيفة الخرائط المدمجة مع بيانات النشاط الإعلاني.
تتيح لك واجهات برمجة التطبيقات الخاصة بـ "الملف التجاري على Google" إنشاء إجراءات، مثل حجز المواعيد، يمكنك استردادها وعرضها في تطبيقاتك، ولكن يتطلّب ذلك اتّخاذ بعض الخطوات اليدوية لتفعيل هذه الميزة، كما هو موضّح أدناه.
عندما يعرض المستخدمون "تفاصيل المكان" لأحد مواقعك الجغرافية في لوحة جانبية، يمكنك تقديم رابط لهم لتحديد موعد. يوضّح هذا القسم كيفية إجراء ذلك.
-
أنشئ واجهة برمجة تطبيقات Business Profile APIs
placeActionLinkلموقع جغرافي من النوعAPPOINTMENTأوONLINE_APPOINTMENTأوDINING_RESERVATION. سيكونplaceActionLinkهو العنصر الذي تستخدمه لرابط الموعد في اللوحة الجانبية. (إذا سبق لك إنشاء رابط إجراء الموعد الذي تريده، انتقِل إلى الخطوة التالية). في ما يلي مثال على ردّ من عملية POST ناجحةplaceActionLinks.create:{ "name": "locations/15899957830169237700/placeActionLinks/9c984be778a7ebbc", "providerType": "MERCHANT", "isEditable": true, "uri": "https://example.com/reservation-uri", "placeActionType": "DINING_RESERVATION", "createTime": "2021-05-01T01:17:41.609161Z", "updateTime": "2021-05-01T01:17:41.609161Z" } -
ابحث عن الموقع الجغرافي للملف التجاري المرتبط بمعرّف المكان على "منصة خرائط Google".
عندما يعرض المستخدمون "تفاصيل المكان"، فإنّهم يعرضون تفاصيل معرّف مكان على "منصة خرائط Google". يرتبط معرّف المكان بمعرّف الموقع الجغرافي للملف التجاري، لذا عليك العثور على معرّف الموقع الجغرافي استنادًا إلى معرّف المكان على الخريطة لاسترداد رابط حجز المواعيد الذي أنشأته وعرضه. إجراء طلبات لواجهات برمجة التطبيقات التالية الخاصة بـ "الملف التجاري على Google":
- أدرِج حسابات مشروعك.
- إدراج جميع المواقع الجغرافية ضمن حساب
- في المواقع الجغرافية للحساب، يحتوي
LocationKeyعلى رقم تعريف المكان في منصة خرائط Google، ويمكنك مقارنته برقم تعريف المكان للموقع الجغرافي الذي يتم عرضه.
-
باستخدام معرّف الموقع الجغرافي، يمكنك الحصول على رابط لاتّخاذ إجراء الذي تريده. لاسترداد موعد حالي
placeActionLink، أدرِج المواعيد الحاليةplaceActionLinksللموقع الجغرافي، وفلتر حسبplaceActionTypeللعثور على رابط الموعد الذي تريد استخدامه (APPOINTMENTأوONLINE_APPOINTMENTأوDINING_RESERVATION).يوضّح المثال التالي
placeActionLinkAPPOINTMENT في الردّ من مكالمة LIST.{ "placeActionLinks": [ { "name": "locations/15899957830169237700/placeActionLinks/9c984be778a7ebbc", "providerType": "MERCHANT", "isEditable": true, "uri": "https://example.com/", "placeActionType": "APPOINTMENT", "createTime": "2021-05-01T01:17:41.609161Z", "updateTime": "2021-05-01T01:17:41.609161Z" } ] } - أنشئ
<div>في اللوحة الجانبية واملأها بالبيانات ذات الصلة من عنصرplaceActionLink، خاصةً معرّف الموارد المنتظم (URI) الخاص برابط حجز المواعيد.
بدائل أخرى لإضافة روابط المواعيد
إذا كنت لا تدير ملفًا تجاريًا أو لا تريد استخدام حلّ Quick Builder Locator Plus، راجِع منصة حجز المواعيد التي تستخدمها للحصول على مستندات حول تضمين أداة حجز في موقع إلكتروني أو تطبيق. يمكنك أيضًا استخدام Google Cloud، مثل Cloud Spanner لنظام إدارة المخزون (فيديو).
عرض العروض المحلية
في اللوحة الجانبية "تفاصيل المكان" لموقع جغرافي، يمكنك عرض عروض محلية يمكن للمستخدمين النقر عليها. تتيح لك واجهة برمجة التطبيقات Google My Business API إنشاء "مشاركات" (مثل العروض الترويجية المحلية) واستردادها، وهي مرتبطة بمواقعك الجغرافية. يوضّح الشكل التالي مثالاً على عرض ترويجي محلي في اللوحة الجانبية الخاصة بـ "تفاصيل المكان".
(يعرض مخطط البنية في قسم أداة الإنشاء السريع التكنولوجيات المتاحة لإضافة عروض إلى أداة البحث عن المتاجر.)
بما أنّ العروض الترويجية المحلية مرتبطة بمواقع جغرافية، عليك العثور على رقم تعريف الموقع الجغرافي الخاص بـ "الملف التجاري" والمرتبط برقم تعريف المكان على "منصة خرائط Google" الخاص بالموقع الجغرافي الذي يعرضه المستخدمون.
عندما يتوفّر لديك معرّف الموقع الجغرافي الخاص بـ "الملف التجاري"، يمكنك استرداد العرض الترويجي ذي الصلة كـ localPost لعرضه في اللوحة الجانبية "تفاصيل المكان". إليك الخطوات التي يمكنك اتّباعها:
- باستخدام Google My Business API، يمكنك إنشاء أي مشاركات عروض تريد عرضها من النوع
OFFER. -
ابحث عن الموقع الجغرافي للملف التجاري أو معرّف الموقع الجغرافي المرتبط بمعرّف المكان على الخريطة.
عندما يعرض المستخدمون "تفاصيل المكان"، فإنّهم يعرضون تفاصيل معرّف مكان على "منصة خرائط Google". يرتبط معرّف المكان بمعرّف الموقع الجغرافي للملف التجاري، لذا عليك العثور على معرّف الموقع الجغرافي استنادًا إلى معرّف المكان على الخريطة لاسترداد رابط العرض الترويجي المحلي وعرضه لموقعك الجغرافي. إجراء طلبات لواجهات برمجة التطبيقات التالية الخاصة بـ "الملف التجاري على Google":
- أدرِج حسابات مشروعك.
- أدرِج جميع المواقع الجغرافية ضمن حساب.
- في المواقع الجغرافية للحساب، يحتوي
LocationKeyعلى معرّف المكان على "خرائط Google"، ويمكنك مقارنته بمعرّف المكان الخاص بالموقع الجغرافي الذي يتم عرضه.
في ما يلي مثال على طلب للحصول على تفاصيل موقع جغرافي في واجهات برمجة تطبيقات "الملف التجاري على Google":
https://mybusiness.googleapis.com/v4/accounts/111098884960588804666/locations/15899957830169237700
تحتوي الاستجابة على الحقل
locationKeyالذي يمثّل رقم تعريف المكان الذي يمكنك استخدامه مع طلبات منصة خرائط Google.وسِّع القسم للاطّلاع على نموذج الردّ.
{ "name": "accounts/111098884960588804666/locations/15899957830169237700", "locationName": "Sushi Sushi", "primaryPhone": "+49 2222 22222", "primaryCategory": { "displayName": "Restaurant", "categoryId": "gcid:restaurant", }, "regularHours": { "periods": [ { "openDay": "MONDAY", "openTime": "09:00", "closeDay": "MONDAY", "closeTime": "09:10" }, { "openDay": "TUESDAY", "openTime": "11:30", "closeDay": "TUESDAY", "closeTime": "24:00" } ] }, "locationKey": { "placeId": "ChIJs4wtL04X2jERbc8qHd_wZzk", "requestId": "2c72cbcb-ea2e-4d66-b684-0ef5f090300c" }, "latlng": { "latitude": 1.3670033, "longitude": 103.8556385 }, "openInfo": { "status": "OPEN", "canReopen": true }, "locationState": { "isGoogleUpdated": true, "canUpdate": true, "canDelete": true, "isVerified": true, "isPublished": true, "canHaveFoodMenus": true }, "attributes": [ { "attributeId": "has_delivery", "valueType": "BOOL", "values": [ false ] }, { "attributeId": "requires_masks_customers", "valueType": "BOOL", "values": [ true ] }, { "attributeId": "url_order_ahead", "valueType": "URL", "urlValues": [ { "url": "https://example.com/" }, ] }, { "attributeId": "pay_credit_card_types_accepted", "valueType": "REPEATED_ENUM", "repeatedEnumValue": { "setValues": [ "visa" ], "unsetValues": [ "american_express" ] } } ], "address": { "regionCode": "SG", "languageCode": "en-US", "postalCode": "560445", "addressLines": [ "445 Ang Mo Kio Ave 10" ] }, "profile": { "description": "Example restaurant" } } -
بعد الحصول على معرّف الموقع الجغرافي، يمكنك الاستفادة من العرض الذي تريده. لاسترداد منشور عرض ترويجي حالي، أدرِج
localPostsالحالي للموقع الجغرافي، وفلتر حسبtopicTypeمنOFFERللعثور على محتوى العرض الترويجي الذي تريد استخدامه.في ما يلي مثال على طلب لعرض "المشاركات المحلية" النشطة لموقع جغرافي معيّن:
https://mybusiness.googleapis.com/v4/accounts/111098884960588804666/locations/15899957830169237700/localPosts
يعرض المثال التالي
OFFERlocalPostفي الردّ.وسِّع القسم للاطّلاع على نموذج الردّ.
{ "localPosts": [ { "name": "accounts/111098884960588804666/locations/15899957830169237700/localPosts/2524928563578730680", "languageCode": "en", "summary": "Buy One Get One Free on all order-ahead bento boxes today!", "state": "LIVE", "event": { "title": "Bento BOGO", "schedule": { "startDate": { "year": 2020, "month": 1, "day": 20 }, "startTime": {}, "endDate": { "year": 2021, "month": 1, "day": 21 }, "endTime": {} } }, "updateTime": "2020-09-11T10:56:22.594Z", "createTime": "2020-09-11T10:56:22.594Z", "searchUrl": "https://local.google.com/place?id=4156539623820808045&use=posts&lpsid=2524928563578730680", "media": [ { "name": "accounts/111098884960588804666/locations/15899957830169237700/media/localPosts/AF1QipOBQCIf40SbF_PPJxb_zvfCHmaTbv9Zw02PoYPS", "mediaFormat": "PHOTO", "googleUrl": "https://lh3.googleusercontent.com/p/AF1QipOBQCIf40SbF_PPJxb_zvfCHmaTbv9Zw02PoYPS" } ], "topicType": "OFFER", "offer": { "couponCode": "BOGO-JET-CODE", "redeemOnlineUrl": "https://www.example.com/redeem", "termsConditions": "Offer only valid for order-ahead orders placed online." } }, ], } - إنشاء
<div>في اللوحة الجانبية وملؤه بالبيانات ذات الصلة من عنصرlocalPost
تخصيص الخريطة
يمكنك تغيير مظهر الخريطة وتفاصيلها بعدة طرق. يمكنك مثلاً:
- يمكنك إنشاء علامات مخصّصة لاستبدال دبابيس الخريطة التلقائية.
- تغيير ألوان عناصر الخريطة لتعكس علامتك التجارية
- التحكّم في نقاط الاهتمام التي تعرضها (مناطق الجذب، والطعام، والإقامة، وما إلى ذلك) وكثافتها، ما يتيح لك تركيز انتباه المستخدم على مواقعك الجغرافية مع إبراز المعالم التي تساعد المستخدمين في الوصول إلى أقرب موقع جغرافي
إنشاء علامات مخصّصة على الخريطة
يمكنك تخصيص العلامات المتقدّمة من خلال تغيير لون الخلفية أو الحدود أو الرمز التلقائي للدبوس (على سبيل المثال، للإشارة إلى ما إذا كان الموقع الجغرافي مفتوحًا)، أو استبدال العلامة بصورة رسومية مخصّصة مثل شعار علامتك التجارية، أو إنشاء علامات مخصّصة باستخدام HTML وCSS. يمكن أن توفّر نوافذ المعلومات معلومات إضافية للمستخدمين، مثل ساعات العمل أو رقم الهاتف أو الصور.
في ما يلي نموذج لخريطة تستخدم محدّدات رسومات مخصّصة. (راجِع رمز المصدر في موضوع علامات الرسومات المخصّصة في Maps JavaScript API).
للحصول على معلومات تفصيلية، راجِع مستندات العلامات المتقدّمة الخاصة بـ JavaScript (الويب) و Android و iOS.
تخصيص مظهر خريطتك
تتيح لك "منصة خرائط Google" تصميم خريطتك بطرق تساعد المستخدمين في العثور على أقرب موقع جغرافي والوصول إليه بأسرع ما يمكن، كما تساعدك في تعزيز علامتك التجارية. على سبيل المثال، يمكنك تغيير ألوان الخريطة لتتوافق مع علامتك التجارية، ويمكنك تقليل عوامل التشتيت على الخريطة من خلال التحكّم في نقاط الاهتمام التي تظهر للمستخدمين. توفّر "منصة خرائط Google" أيضًا عددًا من نماذج الخرائط الأساسية، بعضها محسّن لمختلف المجالات، مثل السفر والخدمات اللوجستية والعقارات والتجزئة.
يمكنك إنشاء أنماط خرائط أو تعديلها في صفحة أنماط الخرائط ضمن مشروعك في Google Cloud Console.
يمكنك توسيع الشاشة للاطّلاع على صور متحركة حول إنشاء أنماط الخرائط وتصميمها في Cloud Console:
أنماط خرائط المجالات
تعرض هذه الصورة المتحركة أنماط خرائط محدّدة مسبقًا خاصة بمجالات معيّنة يمكنك استخدامها. وتوفّر هذه الأنماط نقطة انطلاق مثالية لكل نوع من الصناعات. على سبيل المثال، يقلّل نمط خريطة البيع بالتجزئة من نقاط الاهتمام على الخريطة، ما يتيح للمستخدمين التركيز على مواقعك الجغرافية، بالإضافة إلى المعالم البارزة لمساعدتهم في الوصول إلى أقرب موقع جغرافي بأسرع وقت ممكن وبثقة.
عنصر التحكّم في نقاط الاهتمام
تضبط هذه الصورة المتحركة لون العلامة لنقاط الاهتمام وتزيد كثافة نقاط الاهتمام في نمط الخريطة. وكلما زادت الكثافة، زاد عدد علامات نقاط الاهتمام التي تظهر على الخريطة.
لكل نمط خريطة معرّف خاص به. بعد نشر نمط في Cloud Console، يمكنك الإشارة إلى معرّف الخريطة هذا في الرمز البرمجي، ما يعني أنّه يمكنك تعديل نمط الخريطة في الوقت الفعلي بدون إعادة تصميم تطبيقك. سيظهر الشكل الجديد تلقائيًا في التطبيق الحالي وسيتم استخدامه على جميع المنصات. توضّح الأمثلة التالية كيفية إضافة رقم تعريف خريطة إلى صفحة ويب باستخدام Maps JavaScript API.
من خلال تضمين نمط واحد أو أكثر map_ids في عنوان URL الخاص بالنص البرمجي، تتيح Maps JavaScript API تلقائيًا هذه الأنماط لتسريع عرض الخريطة عند طلب هذه الأنماط في الرمز البرمجي.
<script
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&map_ids=MAP_IDs&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a">
</script>
يعرض الرمز التالي خريطة منمّقة على صفحة الويب. (لا يظهر عنصر HTML <div id="map"></div> الذي ستظهر فيه الخريطة على الصفحة).
map = new google.maps.Map(document.getElementById('map'), { center: {lat: 51.485925, lng: -0.129500}, zoom: 12, mapId: '1234abcd5678efgh' });
يمكنك الاطّلاع على مزيد من المعلومات حول دمج تصميم الخرائط باستخدام السحابة الإلكترونية في JavaScript (الويب) وAndroid وiOS.
الحصول على إحصاءات حول الاستخدام
باستخدام الإحصاءات، يمكنك الحصول على إحصاءات قيّمة حول كيفية تفاعل المستخدمين مع أداة البحث عن أماكن. يقدّم هذا القسم إرشادات حول كيفية إعداد ومراقبة إحصاءات "إحصاءات Google" و"الملف التجاري على Google" لتتبُّع البيانات التي تهمّك أكثر من غيرها. بالنسبة إلى مستخدمي Quick Builder Locator Plus، تساعدك لوحة بيانات الإحصاءات في تحليل البيانات وإنشاء إحصاءات، ما يمنحك صورة عن مدى تفاعل زوّار موقعك الإلكتروني مع أداة البحث عن المتاجر، استنادًا إلى بيانات مجهولة الهوية.
للوصول إلى هذا التقرير، انتقِل إلى قسم تقارير التفاعل في Cloud Console. لمزيد من التفاصيل حول هذا التقرير، يُرجى الاطّلاع على تقارير التفاعل.
بما أنّ "إحصاءات Google" توفّر العديد من الميزات، لن نقدّم معلومات شاملة حول الإعداد والاستخدام. بدلاً من ذلك، سنقدّم لك مستندات أساسية للاطّلاع على مزيد من المعلومات والتعليمات، مع تسليط الضوء على الاعتبارات الرئيسية المتعلقة بالإحصاءات لتطبيق تحديد الموقع الجغرافي.
إعداد برنامج Google Analytics
إذا كنت تستخدم "إحصاءات Google" حاليًا مع تطبيقك، يمكنك تخطّي هذا القسم.
في ما يلي مثال على "علامة شاملة" يمكنك لصقها على موقعك الإلكتروني لتفعيل "إحصاءات Google".
<!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/ gtag/js?id=G-XR5B5D4NW0"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-XR5B5D4NW0'); </script>
سواء كنت تستخدم "إدارة العلامات من Google" أو تضيف "إحصاءات Google" مباشرةً إلى موقعك الإلكتروني، المهم هو معرفة كيفية استخدام عملية تنفيذ "إحصاءات Google" لإجراء ما يلي:
- تفعيل تفاعلات المستخدمين، مثل النقرات، التي يمكن قياسها بشكل مستقل عن مشاهدات صفحات الموقع الإلكتروني (الأحداث)
- عرض البيانات الأولية (المقاييس) في مجموعات ذات معنى (السمات أو السمات المخصّصة)
استخدام الأحداث المخصّصة
في ما يلي مثال على تحديد حدث مخصص في أداة البحث عن أماكن:
gtag('event', 'location', { 'method': 'address' });
من المهم تسمية event وmethod بشكل واضح بما يكفي
لتتمكّن من فهم الأحداث في التقارير. يمكنك تفعيلها عند حدوث تفاعلات معيّنة تريد قياسها، مثل عندما يختار المستخدم عنوانًا من القائمة المنسدلة "الإكمال التلقائي"، كما هو موضّح في الشكل التالي.
يمكنك إرسال طلب التتبُّع التالي إلى "إحصاءات Google" الذي يستخدم الحدث والطريقة اللذين حدّدتهما. (سنعرض كل مَعلمة طلب بحث في سطر منفصل لتسهيل القراءة).
https://www.google-analytics.com/g/collect?v=2 &tid=G-XR5B5D4NW0 >m=2oe550 &_p=64678170 &sr=1920x1200 &ul=fr &cid=489856786.1598861364 &_s=2 &dl=http%3A%2F%2.storelocator.html &dt=Store%20Locator &sid=1620827159 &sct=1 &seg=1 &en=location &_et=6032 &ep.method=address
يوضّح الشكل التالي كيف يظهر طلب "إحصاءات Google" هذا في عرض "الفحص" للمتصفّح، ضمن علامة التبويب "الشبكة". (انقر للتكبير).
يمكنك التأكّد من أنّه يتم تسجيل علامات الأحداث المخصّصة بشكلٍ سليم من خلال عرض "الوقت الفعلي" في "إحصاءات Google". على سبيل المثال، يظهر الحدث "الموقع الجغرافي" الذي تم إعداده سابقًا لميزة "الإكمال التلقائي للمكان" في "إحصاءات Google" كما هو موضّح في الأشكال التالية.
بدلاً من ذلك، يمكنك مراقبة الأحداث في الوقت الفعلي باستخدام DebugView، كما هو موضّح في الشكل التالي. يُرجى العِلم أنّه عليك الانتظار لمدة 24 ساعة قبل الوصول إلى تقرير "الأحداث" الكامل في قسم التفاعل > الأحداث ضمن "إحصاءات Google".
يمكنك أيضًا وضع استراتيجيات وقياسها لجذب المزيد من الزيارات إلى مواقعك الجغرافية من تطبيق تحديد الموقع الجغرافي. على سبيل المثال، تتضمّن "إحصاءات Google" ميزة زيارات المتجر في "إحصاءات Google" التي تربط إحصاءات زيارات المتجر (التي تقيسها "إعلانات Google") بإحصاءات تطبيق تحديد الموقع الجغرافي. يمكنك أيضًا وضع استراتيجيات خاصة بك للتطبيقات والمواقع الجغرافية، مثل العروض الترويجية على الإنترنت التي يمكن الاستفادة منها في مواقعك الجغرافية.
مقاييس "الملف التجاري"
بالإضافة إلى تتبُّع الأحداث والمقاييس والسمات التي تهمّك باستخدام "إحصاءات Google"، يتضمّن الملف التجاري أيضًا مقاييس خاصة به. على سبيل المثال، إذا أضفت روابط لحجز المواعيد وعروض محلية إلى أداة البحث عن أماكن، يمكنك الحصول على مقاييس حول هذه المشاهدات والنقرات.
يطلب نموذج الطلب التالي إلى واجهات برمجة تطبيقات "الملف التجاري على Google" أنواعًا متعددة من المقاييس. لتتبُّع النقرات على العروض، سيكون مقياسا LOCAL_POST_VIEWS_SEARCH وLOCAL_POST_ACTIONS_CALL_TO_ACTION هما الأكثر صلة.
وسِّع القسم لعرض طلب العيّنة.
POST https://mybusiness.googleapis.com/v4/accounts/111098884960528804666/locations:reportInsights
Body:
{
"locationNames": [
"accounts/111098884960528804666/locations/15899957830169237700"
],
"basicRequest": {
"metricRequests": [
{
"metric": "QUERIES_DIRECT"
},
{
"metric": "QUERIES_INDIRECT"
},
{
"metric": "VIEWS_MAPS"
},
{
"metric": "VIEWS_SEARCH"
},
{
"metric": "ACTIONS_DRIVING_DIRECTIONS"
},
{
"metric": "LOCAL_POST_VIEWS_SEARCH"
},
{
"metric": "LOCAL_POST_ACTIONS_CALL_TO_ACTION"
}
],
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
}
}وسِّع القسم للاطّلاع على نموذج الردّ.
{
"locationMetrics": [
{
"locationName": "accounts/111098884960528804666/locations/15899957830169237700",
"timeZone": "Asia/Singapore",
"metricValues": [
{
"metric": "QUERIES_DIRECT",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "82"
}
},
{
"metric": "QUERIES_INDIRECT",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "1493"
}
},
{
"metric": "VIEWS_MAPS",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "1571"
}
},
{
"metric": "VIEWS_SEARCH",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "631"
}
},
{
"metric": "ACTIONS_DRIVING_DIRECTIONS",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "3"
}
},
{
"metric": "LOCAL_POST_ACTIONS_CALL_TO_ACTION",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "42"
}
},
{
"metric": "LOCAL_POST_VIEWS_SEARCH",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "11"
}
}
]
}
]
}
تحتوي الاستجابة على المقاييس، وأبرزها:
- 1571 مشاهدة للموقع الجغرافي على "خرائط Google"
- 631 مشاهدة للموقع الجغرافي على "بحث Google"
- 3 طلبات للحصول على اتجاهات القيادة إلى الموقع الجغرافي
- 42
LOCAL_POST_ACTIONS_CALL_TO_ACTIONنقرة على العرض - 11 صورة لمنشورات محلية على "بحث Google"
يتضمّن خيار المقاييس الآخر استخدام الحجز عبر Google لإنشاء روابط إجراءات. عندما ينقر المستخدمون على روابط الإجراءات التي تم إنشاؤها في "الحجز عبر Google"، يمكنك تسجيل هذه الإجراءات في "إحصاءات Google"، ما يتيح لك تتبُّع الإحالات الناجحة في "إحصاءات Google". لمزيد من المعلومات، اطّلِع على مستندات تتبُّع الإحالات الناجحة.
بغض النظر عن استراتيجية المقاييس التي تستخدمها، القياس لا يقتصر على معرفة مستوى أدائك مقارنةً بمؤشرات الأداء الرئيسية. تساعدك الأرقام أيضًا في فهم تأثير هذه التحسينات على أداة البحث عن أماكن في نشاطك التجاري. بالإضافة إلى ذلك، يمكنك مقارنة المقاييس من "إحصاءات Google" في أداة تحديد الموقع الجغرافي بمقاييس "الملف التجاري". على سبيل المثال، من خلال مقارنة هذه المقاييس، يمكنك معرفة عدد العملاء الذين يحصلون على الاتجاهات من أداة البحث عن أماكن و"خرائط Google" ثم يزورون مواقعك الجغرافية.
تحسين Locator Plus
بناءً على احتياجات نشاطك التجاري أو المستخدمين، يمكنك تحسين تجربة المستخدم بشكل أكبر.
إرسال الاتجاهات إلى الجهاز الجوّال
لتسهيل وصول المستخدمين إلى موقع جغرافي، يمكنك إرسال رابط يتضمّن الاتجاهات إليهم عبر رسالة نصية أو رسالة إلكترونية. عندما ينقر المستخدم على الرابط، سيتم تشغيل تطبيق "خرائط Google" على هاتفه إذا كان مثبّتًا، أو سيتم تحميل maps.google.com في متصفّح الويب على جهازه. توفّر كلتا التجربتين للمستخدم خيار استخدام ميزة التنقّل مع اتجاهات مفصّلة، بما في ذلك الإرشاد الصوتي، للوصول إلى الوجهة.
استخدِم
عناوين URL في "خرائط Google" لإنشاء عنوان URL خاص بالاتجاهات على النحو التالي، مع اسم المكان المرمّز كعنوان URL كالمعلَمة destination ورقم تعريف المكان كالمعلَمة destination_place_id. لا تتوفّر أي تكلفة لإنشاء عناوين URL في "خرائط Google" أو استخدامها، لذا لست بحاجة إلى تضمين مفتاح واجهة برمجة التطبيقات في عنوان URL.
https://www.google.com/maps/dir/?api=1&destination=Google%20London&destination_place_id=ChIJVSZzVR8FdkgRTyQkxxLQmVU
يمكنك اختياريًا تقديم مَعلمة طلب بحث origin باستخدام تنسيق العنوان نفسه المستخدَم في الوجهة. ولكن عند حذفها، تبدأ الاتجاهات من الموقع الجغرافي الحالي للمستخدم، والذي قد يختلف عن الموقع الجغرافي الذي كان يستخدم فيه تطبيق Locator Plus. توفّر عناوين URL في "خرائط Google" خيارات إضافية لمعلمات طلب البحث، مثل travelmode وdir_action=navigate لتشغيل الاتجاهات مع تفعيل ميزة التنقّل.
يؤدي هذا الرابط القابل للنقر، الذي يوسّع نطاق مثال عنوان URL أعلاه، إلى ضبط origin
كاستاد لكرة القدم في لندن واستخدام travelmode=transit لتوفير
إرشادات حول وسائل النقل العام إلى الوجهة.
لإرسال رسالة نصية أو رسالة إلكترونية تحتوي على عنوان URL هذا، ننصحك باستخدام تطبيق تابع لجهة خارجية، مثل twilio. إذا كنت تستخدم App Engine، يمكنك الاستعانة بشركات خارجية لإرسال رسائل SMS أو رسائل إلكترونية. لمزيد من المعلومات، يُرجى الاطّلاع على مقالة إرسال الرسائل باستخدام خدمات تابعة لجهات خارجية.
عرض "التجوّل الافتراضي" لمساعدة المستخدمين على تصوّر المواقع الجغرافية
في العديد من المواقع الجغرافية حول العالم، يمكن استخدام ميزة "التجوّل الافتراضي" لعرض الجزء الخارجي من موقع جغرافي، ما يتيح للمستخدمين الحصول على صورة مرئية للموقع قبل الوصول إليه. يمكنك توفير صور "التجوّل الافتراضي" إما بشكل تفاعلي (على الويب) أو ثابت (من خلال واجهة برمجة التطبيقات)، وذلك حسب ما إذا كنت تريد أن يتمكّن المستخدمون من "النظر حولهم" في المنطقة بزاوية 360 درجة. يتوفّر تطبيق "التجوّل الافتراضي" أيضًا على أجهزة Android وiOS.
تحديد الموقع الجغرافي للمستخدم باستخدام Geolocation
في معظم الحالات، يمكنك تحديد الموقع الجغرافي للمستخدم بدقة باستخدام خدمات الموقع الجغرافي المضمّنة في أجهزته أو متصفّحاته. نقدّم مثالاً على استخدام ميزة تحديد الموقع الجغرافي المستندة إلى HTML5 في المتصفّح لعرض الموقع الجغرافي للمستخدم أو الجهاز على خريطة Google، كما تتوفّر مستندات حول طلب الأذونات والحصول على الموقع الجغرافي في Android و iOS. ومع ذلك، قد تحتاج في بعض الحالات إلى أداة بديلة لتحديد الموقع الجغرافي، مثلاً إذا كانت خدمات الموقع الجغرافي على الجهاز غير مفعّلة أو إذا كنت قلقًا بشأن تزييف الموقع الجغرافي للجهاز.
Geolocation API هي واجهة برمجة تطبيقات من جهة الخادم تعرض موقعًا جغرافيًا ونطاق دقة استنادًا إلى معلومات حول أبراج الاتصالات وعُقد Wi-Fi التي يمكن للعميل رصدها. يمكنك استخدام الموقع الجغرافي كآلية احتياطية لتحديد الموقع الجغرافي للمستخدم، أو يمكنك استخدامه للتحقّق من الموقع الجغرافي الذي يحدّده الجهاز.
الجمع بين بيانات الموقع الجغرافي المخصّصة وخدمة "تفاصيل المكان"
في القسم السابق توفير تفاصيل المكان، تناولنا كيفية استخدام تفاصيل المكان لتزويد المستخدمين بمستوى غني من المعلومات حول مواقعك الجغرافية، مثل ساعات العمل والصور والمراجعات.
من المفيد فهم مستويات الأسعار ورموز التخزين التعريفية لحقول البيانات المختلفة في Places API (الجديدة). لإدارة تكاليفك، تتمثّل إحدى الاستراتيجيات في الجمع بين المعلومات المتوفّرة لديك عن مواقعك الجغرافية والمعلومات الجديدة من "خرائط Google"، مثل الإغلاق المؤقت وساعات العمل خلال العطلات وتقييمات المستخدمين وصورهم ومراجعاتهم. إذا كانت لديك معلومات الاتصال الخاصة بمواقعك الجغرافية، لن تحتاج إلى طلب هذه الحقول من "تفاصيل المكان" ويمكنك حصر قناع الحقل لجلب الحقول التي تريد عرضها فقط.
قد تتوفّر لديك بيانات خاصة بالأماكن يمكنك استخدامها بدلاً من بيانات "تفاصيل المكان" أو لإكمالها. تقدّم ورشة العمل البرمجية الخاصة بأداة تحديد الموقع الجغرافي المتكاملة مثالاً على استخدام GeoJSON مع قاعدة بيانات لتخزين تفاصيل الموقع الجغرافي واسترجاعها.