تصميم خريطة

يتناول هذا المستند كيفية تخصيص مظهر الخريطة وأسلوبها والتحكّم في خيارات إظهار البيانات ونافذة العرض. ويمكنك إجراء ذلك بالطرق التالية:

  • استخدام ميزة "تصميم الخرائط باستخدام السحابة الإلكترونية"
  • ضبط خيارات نمط الخريطة مباشرةً في الرمز البرمجي الخاص بك

تصميم الخريطة باستخدام ميزة "تصميم الخرائط باستخدام السحابة الإلكترونية"

لتطبيق نمط خريطة على خريطة مشاركة الرحلات للمستهلكين في JavaScript، حدِّد mapId وأي mapOptions آخر عند إنشاء JourneySharingMapView.

توضّح الأمثلة التالية كيفية تطبيق نمط خريطة باستخدام معرّف خريطة.

JavaScript

const mapView = new google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  mapOptions: {
    mapId: 'YOUR_MAP_ID'
  }
  // Any other styling options.
});

TypeScript

const mapView = new google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  mapOptions: {
    mapId: 'YOUR_MAP_ID'
  }
  // Any other styling options.
});

تخصيص تصميم الخرائط مباشرةً في الرمز البرمجي

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

JavaScript

const mapView = new google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  mapOptions: {
    styles: [
      {
        "featureType": "road.arterial",
        "elementType": "geometry",
        "stylers": [
          { "color": "#CCFFFF" }
        ]
      }
    ]
  }
});

TypeScript

const mapView = new google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  mapOptions: {
    styles: [
      {
        "featureType": "road.arterial",
        "elementType": "geometry",
        "stylers": [
          { "color": "#CCFFFF" }
        ]
      }
    ]
  }
});

التحكّم في إمكانية وصول حزمة تطوير البرامج (SDK) إلى بيانات المهام

يمكنك التحكّم في ظهور عناصر مهام معيّنة على الخريطة باستخدام قواعد الظهور.

مستوى الظهور التلقائي لبيانات المهام

تكون بيانات المهام المسندة إلى مركبة مرئية تلقائيًا عندما تكون المركبة على بُعد 5 محطات توقّف من المَهمة. وتنتهي إمكانية الاطّلاع على هذه المعلومات عند إكمال المهمة أو إلغائها.

يعرض هذا الجدول مستوى العرض التلقائي لكل نوع من المهام. يمكنك تخصيص مستوى الرؤية للعديد من المهام، ولكن ليس كلها. لمزيد من التفاصيل حول أنواع المهام، يُرجى الاطّلاع على أنواع المهام في دليل المهام المُجدوَلة.

نوع المهمة مستوى الرؤية التلقائي هل يمكن تخصيصها؟ الوصف
مهام عدم التوفّر غير مرئية لا يُستخدَم هذا الحقل لفترات استراحة السائق وإعادة التزوّد بالوقود. إذا كان المسار المؤدي إلى مهمة تسليم يتضمّن أيضًا محطة توقّف أخرى للمركبة، لن تظهر هذه المحطة إذا كانت تتضمّن مهام عدم توفّر فقط. ولا يزال وقت الوصول المقدَّر والوقت المقدَّر لإكمال المهمة يظهران لمهمة التسليم نفسها.
فتح مهام المركبة Visible نعم وتنتهي إمكانية الاطّلاع على المهمة عند اكتمالها أو إلغائها. يمكنك تخصيص مستوى ظهور مهام المركبات المفتوحة. يُرجى الاطّلاع على تخصيص مستوى رؤية مهام المركبات المفتوحة.
مهام المركبات المغلقة غير مرئية لا لا يمكنك تخصيص مستوى ظهور مهام المركبات المغلقة.

تخصيص مستوى رؤية مهام المركبات المفتوحة

توفّر واجهة TaskTrackingInfo عددًا من عناصر بيانات المهام التي يمكن عرضها باستخدام حزمة تطوير البرامج (SDK) للمستهلك.

عناصر بيانات المهام القابلة للتخصيص

الخطوط المتعدّدة للمسار

الوقت المقدَّر للوصول

الوقت المقدَّر لإكمال المهمة

مسافة القيادة المتبقية للوصول إلى المهمة

عدد محطات التوقف المتبقية

الموقع الجغرافي للمركبة

خيارات مستوى الظهور لكل مهمة

يمكنك تخصيص إعدادات مستوى العرض لكل مهمة على حدة من خلال ضبط TaskTrackingViewConfig عند إنشاء مهمة أو تعديلها ضمن Fleet Engine. استخدم خيارات الرؤية التالية لإنشاء معايير لتحديد رؤية عنصر المهمة:

خيارات مستوى الظهور

عدد محطات التوقف المتبقية

المدة المتبقية حتى وقت الوصول المتوقَّع

المسافة المتبقية للقيادة

مرئي دائمًا

غير مرئية مطلقًا

للتوضيح، لنفترض أنّ مثالاً على التخصيص يضبط مستوى العرض لثلاثة عناصر بيانات باستخدام المعايير الموضّحة في الجدول التالي. وتتّبع جميع العناصر الأخرى قواعد مستوى العرض التلقائية.

عنصر البيانات المطلوب تعديله مستوى الرؤية المعيار
خطوط متعدّدة للمسار إظهار المركبة على بُعد 3 محطات أو أقل.
الوقت المُقدّر للوصول إظهار مسافة القيادة المتبقية أقل من 5000 متر.
عدد محطات التوقف المتبقية عدم الإظهار مطلقًا المركبة على بُعد 3 محطات أو أقل.

يوضّح المثال التالي هذه الإعدادات:

"taskTrackingViewConfig": {
  "routePolylinePointsVisibility": {
    "remainingStopCountThreshold": 3
  },
  "estimatedArrivalTimeVisibility": {
    "remainingDrivingDistanceMetersThreshold": 5000
  },
  "remainingStopCountVisibility": {
    "never": true
  }
}

قواعد ظهور الخطوط المتعدّدة للمسارات والموقع الجغرافي للمركبة

لا يمكن عرض الخطوط المتعدّدة للمسار إلا إذا كان الموقع الجغرافي للمركبة معروضًا أيضًا، وإلا يمكن استنتاج الموقع الجغرافي للمركبة من نهاية الخط المتعدّد.

تساعدك هذه الإرشادات في توفير تركيبة صالحة لخيارات مستوى رؤية الخطوط المتعدّدة للمسار والموقع الجغرافي للمركبة.

خيارات مستوى الظهور نفسها معيار مستوى الظهور الإرشادات
تم ضبط خيارات الخطوط المتعدّدة للمسار على "مرئية دائمًا". اضبط الموقع الجغرافي للمركبة على "مرئي دائمًا".
تم ضبط إعدادات الموقع الجغرافي للمركبة على "غير مرئي أبدًا". ضبط الخطوط المتعدّدة للمسار على "غير مرئية أبدًا"
خيار مستوى العرض هو أيّ مما يلي:
  • عدد المحطات المتبقية
  • المدة حتى الوقت المتوقّع للوصول
  • المسافة المتبقية للقيادة

اضبط خيارات الخطوط المتعدّدة للمسار على قيمة أقل من أو تساوي القيمة المحدّدة لموقع المركبة الجغرافي. على سبيل المثال:

    "taskTrackingViewConfig": {
      "routePolylinePointsVisibility": {
        "remainingStopCountThreshold": 3
      },
      "vehicleLocationVisibility": {
        "remainingStopCountThreshold": 5
      },
    }
    
خيارات مختلفة لمستوى العرض معايير الظهور الإرشادات
الموقع الجغرافي للمركبة مرئي

يحدث ذلك فقط عند استيفاء كلّ من خيارات الموقع الجغرافي للمركبة وإمكانية رؤية الخطوط المتعدّدة. على سبيل المثال:

  "taskTrackingViewConfig": {
    "routePolylinePointsVisibility": {
      "remainingStopCountThreshold": 3
    },
    "vehicleLocationVisibility": {
      "remainingDrivingDistanceMetersThreshold": 3000
    },
  }

في هذا المثال، لا يظهر الموقع الجغرافي للمركبة إلا إذا كان عدد المحطات المتبقية هو 3 على الأقل و مسافة القيادة المتبقية هي 3000 متر على الأقل.

إيقاف ميزة "الملاءمة التلقائية"

يمكنك منع الخريطة من ضبط إطار العرض تلقائيًا ليتناسب مع المركبة والمسار المتوقّع من خلال إيقاف ميزة الضبط التلقائي. يوضّح المثال التالي كيفية إيقاف الملاءمة التلقائية عند ضبط عرض خريطة مشاركة الرحلة.

JavaScript

const mapView = new
    google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  automaticViewportMode:
      google.maps.journeySharing
          .AutomaticViewportMode.NONE,
  ...
});

TypeScript

const mapView = new
    google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  automaticViewportMode:
      google.maps.journeySharing
          .AutomaticViewportMode.NONE,
  ...
});

الخطوات التالية