تصميم خريطة

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

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

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

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

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

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

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 في مرجع Google Maps JavaScript API.

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

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 محطات من المهمة. تنتهي إمكانية الاطّلاع على المهمة عند إكمالها أو إلغائها.

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

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

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

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

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

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

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

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

المضلّعات المتعددة للمسارات وقواعد مستوى رؤية الموقع الجغرافي للمركبة

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

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

    "taskTrackingViewConfig": {
      "routePolylinePointsVisibility": {
        "remainingStopCountThreshold": 3
      },
      "vehicleLocationVisibility": {
        "remainingStopCountThreshold": 5
      },
    }
    

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

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

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

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

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

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

• تخصيص العلامات
• تخصيص الخطوط المتعددة