मैप को शैली में ढालें

इस दस्तावेज़ में, मैप के लुक और फ़ील को पसंद के मुताबिक बनाने का तरीका बताया गया है. साथ ही, इसमें डेटा दिखने और व्यूपोर्ट के विकल्पों को कंट्रोल करने के बारे में भी बताया गया है. ऐसा इन तरीकों से किया जा सकता है:

  • क्लाउड पर मैप की स्टाइलिंग की सुविधा का इस्तेमाल करना
  • अपने कोड में सीधे तौर पर मैप स्टाइल के विकल्प सेट करना

क्लाउड पर मैप की स्टाइलिंग की सुविधा का इस्तेमाल करके, मैप को स्टाइल करना

JavaScript उपभोक्ता के यात्रा शेयरिंग मैप पर मैप स्टाइल लागू करने के लिए, JourneySharingMapView बनाते समय mapId और कोई अन्य mapOptions तय करें.

यहां दिए गए उदाहरणों में, मैप आईडी की मदद से मैप स्टाइल लागू करने का तरीका बताया गया है.

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 बनाते समय, मैप के विकल्प सेट करके भी मैप की स्टाइलिंग को पसंद के मुताबिक बनाया जा सकता है. यहां दिए गए उदाहरणों में, मैप के विकल्पों का इस्तेमाल करके मैप को स्टाइल करने का तरीका बताया गया है. मैप के लिए कौन-कौनसे विकल्प सेट किए जा सकते हैं, इस बारे में ज़्यादा जानने के लिए, Google Maps JavaScript API के रेफ़रंस में mapOptions देखें.

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" }
        ]
      }
    ]
  }
});

इससे यह तय होता है कि एसडीके को टास्क का डेटा दिखेगा या नहीं

'किसको दिखें' नियमों का इस्तेमाल करके, मैप पर कुछ टास्क ऑब्जेक्ट के दिखने की सेटिंग को कंट्रोल किया जा सकता है.

टास्क के डेटा के लिए डिफ़ॉल्ट तौर पर किसको दिखे

डिफ़ॉल्ट रूप से, किसी वाहन को असाइन किए गए टास्क का डेटा तब दिखता है, जब वाहन टास्क की जगह से पांच स्टॉप के दायरे में हो. टास्क पूरा होने या रद्द होने पर, यह सुविधा बंद हो जाती है.

इस टेबल में, हर तरह के टास्क के लिए डिफ़ॉल्ट रूप से दिखने की सेटिंग दिखाई गई है. कई टास्क के लिए, दिखने की सेटिंग को पसंद के मुताबिक बनाया जा सकता है. हालांकि, ऐसा सभी टास्क के लिए नहीं किया जा सकता. टास्क के टाइप के बारे में ज़्यादा जानने के लिए, शेड्यूल किए गए टास्क गाइड में टास्क के टाइप देखें.

टास्क का टाइप डिफ़ॉल्ट व्यू क्या इसे पसंद के मुताबिक बनाया जा सकता है? ब्यौरा
उपलब्ध न होने से जुड़े टास्क नहीं दिख रहा है नहीं इसका इस्तेमाल ड्राइवर के ब्रेक लेने और ईंधन भरने के लिए किया जाता है. अगर डिलीवरी के किसी टास्क के रास्ते में वाहन का कोई और स्टॉप भी शामिल है, तो उस स्टॉप को नहीं दिखाया जाता. ऐसा तब होता है, जब उस स्टॉप पर सिर्फ़ वाहन के उपलब्ध न होने से जुड़े टास्क मौजूद हों. डिलीवरी के टास्क के लिए, पहुंचने का अनुमानित समय और टास्क पूरा होने का अनुमानित समय अब भी दिखता है.
वाहन से जुड़े टास्क खोलें दिख रहा है हां टास्क पूरा होने या रद्द होने पर, यह सुविधा काम नहीं करती. आपके पास यह तय करने का विकल्प होता है कि खुले हुए वाहन के टास्क किसे दिखें. चालू वाहन टास्क की दृश्यता को पसंद के मुताबिक बनाएं लेख पढ़ें.
वाहन से जुड़े बंद किए गए टास्क नहीं दिख रहा है नहीं बंद किए गए वाहन के टास्क की दृश्यता को पसंद के मुताबिक नहीं बनाया जा सकता.

खुले हुए वाहन टास्क की दृश्यता को पसंद के मुताबिक बनाना

TaskTrackingInfo इंटरफ़ेस में, टास्क से जुड़े कई डेटा एलिमेंट होते हैं. इन्हें Consumer SDK की मदद से दिखाया जा सकता है.

टास्क के डेटा एलिमेंट को पसंद के मुताबिक बनाने की सुविधा

रास्ते की पॉलीलाइन

पहुंचने का अनुमानित समय

टास्क पूरा होने का अनुमानित समय

टास्क की जगह तक पहुंचने के लिए बची हुई दूरी

बची हुई स्टॉप की संख्या

वाहन की जगह

हर टास्क के लिए, दिखने से जुड़े विकल्प

Fleet Engine में कोई टास्क बनाते या उसे अपडेट करते समय, TaskTrackingViewConfig सेट करके, हर टास्क के लिए दिखने की सेटिंग को अपनी पसंद के मुताबिक बनाया जा सकता है. टास्क एलिमेंट की विज़िबिलिटी तय करने के लिए, यहां दिए गए विज़िबिलिटी के विकल्पों का इस्तेमाल करें:

किसको दिखाई दे, इसके विकल्प

बची हुई स्टॉप की संख्या

अनुमानित समय तक की अवधि

ड्राइविंग के लिए बची हुई दूरी

मैसेज हमेशा दिखता है

कभी नहीं दिखता

उदाहरण के लिए, मान लें कि कस्टमर के हिसाब से बनाए गए किसी उदाहरण में, यहां दी गई टेबल में दिखाए गए मानदंड का इस्तेमाल करके, तीन डेटा एलिमेंट के दिखने की सेटिंग में बदलाव किया जाता है. अन्य सभी एलिमेंट, दिखने से जुड़े डिफ़ॉल्ट नियमों के मुताबिक दिखते हैं.

बदलाव करने के लिए डेटा एलिमेंट किसको दिखे मानदंड
रास्ते की पॉलीलाइन दिखाएं वाहन, तीन स्टॉप के दायरे में हो.
ईटीए दिखाएं ड्राइविंग के लिए बची हुई दूरी 5,000 मीटर से कम है.
बची हुई स्टॉप की संख्या कभी न दिखाएं वाहन, तीन स्टॉप के दायरे में हो.

इस कॉन्फ़िगरेशन को यहां दिए गए उदाहरण में दिखाया गया है:

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

रास्ते की पॉलीलाइन और वाहन की जगह की जानकारी दिखने से जुड़े नियम

जब तक वाहन की जगह की जानकारी नहीं दिखती, तब तक रास्ते की पॉलीलाइन नहीं दिख सकती. अगर वाहन की जगह की जानकारी नहीं दिखती है, तो पॉलीलाइन के आखिर में वाहन की जगह की जानकारी का अनुमान लगाया जा सकता है.

इन दिशा-निर्देशों की मदद से, route polyline और वाहन की जगह की जानकारी दिखाने के विकल्पों के लिए, मान्य कॉम्बिनेशन उपलब्ध कराया जा सकता है.

मिलते-जुलते प्रॉडक्ट से तुलना प्रॉडक्ट के दिखने के लिए मानदंड दिशा-निर्देश
रास्ते की पॉलीलाइन के विकल्पों को 'हमेशा दिखे' पर सेट किया गया हो. वाहन की जगह की जानकारी को हमेशा दिखने के लिए सेट करें.
वाहन की जगह की जानकारी को 'कभी नहीं दिखे' पर सेट किया गया हो. रास्ते की पॉलीलाइन को कभी न दिखने के तौर पर सेट करें.
'किसको दिखे' सेटिंग के लिए इनमें से कोई भी विकल्प चुना गया हो:
  • बचे हुए स्टॉप की संख्या
  • ईटीए तक की अवधि
  • बची हुई ड्राइविंग दूरी

रास्ते की पॉलीलाइन के विकल्पों को, वाहन की जगह के लिए सेट की गई वैल्यू से कम या उसके बराबर वैल्यू पर सेट करें. उदाहरण के लिए:

    "taskTrackingViewConfig": {
      "routePolylinePointsVisibility": {
        "remainingStopCountThreshold": 3
      },
      "vehicleLocationVisibility": {
        "remainingStopCountThreshold": 5
      },
    }
दिखने के अलग-अलग विकल्प प्रॉडक्ट के दिखने के लिए मानदंड दिशा-निर्देश
गाड़ी की जगह की जानकारी दिख रही है

ऐसा सिर्फ़ तब होता है, जब वाहन की जगह की जानकारी और पॉलीलाइन दिखने की सुविधा, दोनों चालू हों. उदाहरण के लिए:

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

इस उदाहरण में, वाहन की जगह की जानकारी सिर्फ़ तब दिखेगी, जब स्टॉप की बची हुई संख्या कम से कम 3 और ड्राइविंग की बची हुई दूरी कम से कम 3,000 मीटर हो.

अपने-आप फ़िट होने की सुविधा बंद करना

ऑटोमैटिक फ़िटिंग की सुविधा बंद करके, मैप को वाहन और अनुमानित रास्ते के हिसाब से व्यूपोर्ट को अपने-आप फ़िट करने से रोका जा सकता है. यहां दिए गए उदाहरण में, यात्रा की जानकारी शेयर करने की सुविधा के मैप व्यू को कॉन्फ़िगर करते समय, अपने-आप फ़िट होने की सुविधा को बंद करने का तरीका बताया गया है.

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,
  ...
});

आगे क्या करना है