मार्कर कस्टमाइज़ करें

प्लैटफ़ॉर्म चुनें: Android iOS JavaScript

मैप में जोड़े गए मार्कर के लुक और स्टाइल को पसंद के मुताबिक बनाएं. लुक को पसंद के मुताबिक बनाएं और मैप में जोड़े गए मार्कर को दो तरीकों से दिखाया जाता है:

  1. टाइप के आधार पर स्टाइल मार्कर: तय करें MarkerOptions ऑब्जेक्ट को एक ही तरह के स्टाइल मार्कर के लिए इस्तेमाल करना चाहते हैं. आपके बताए गए बदलाव फिर हर मार्कर के बनने के बाद लागू किया जाता है, ताकि सभी डिफ़ॉल्ट विकल्प ओवरराइट हो जाएं. उदाहरण के लिए, देखें इसमें MarkerOptions का इस्तेमाल करके मार्कर की स्टाइल बदलें. पढ़ें.

  2. डेटा के आधार पर स्टाइल मार्कर: यह करने के लिए कस्टमाइज़ेशन फ़ंक्शन तय करें स्टाइल मार्कर का इस्तेमाल किया जा सकता है. आपके पास सफ़र के डेटा के आधार पर स्टाइल चुनने का विकल्प है शेयर करने के लिए या बाहरी सोर्स से:

    • यात्रा शेयर करने से मिलने वाला डेटा: यात्रा शेयर करने की सुविधा, मार्कर डेटा को कस्टमाइज़ेशन फ़ंक्शन, जिसमें मार्कर से पता चलता है कि ऑब्जेक्ट का टाइप क्या है: वाहन, ऑरिजिन, वेपॉइंट या डेस्टिनेशन. इसके बाद, मार्कर एलिमेंट की मौजूदा स्थिति के आधार पर, मार्कर की स्टाइल बदल जाती है. उदाहरण के लिए, वाहन के यात्रा खत्म होने तक वेपॉइंट बाकी हैं.

    • बाहरी सोर्स: फ़्लाइट की जानकारी शेयर करने वाले डेटा को, Fleet Engine के बाहर के सोर्स के डेटा के साथ जोड़ा जा सकता है. साथ ही, उस जानकारी के आधार पर मार्कर को स्टाइल भी किया जा सकता है.

    उदाहरण के लिए, देखें कस्टमाइज़ेशन फ़ंक्शन का इस्तेमाल करके मार्कर की स्टाइल बदलना देखें.

  3. मार्कर में क्लिक हैंडलिंग जोड़ना: उदाहरण के लिए, क्लिक हैंडलिंग जोड़ना लेख देखें.

मार्कर को पसंद के मुताबिक बनाने के विकल्प

Google में दोनों विकल्प, इन कस्टमाइज़ेशन पैरामीटर का इस्तेमाल करते हैं इसके तहत, Maps JavaScript API को FleetEngineTripLocationProviderOptions:

MarkerOptions का इस्तेमाल करके मार्कर की स्टाइल बदलें

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

JavaScript

deliveryVehicleMarkerCustomization = {
  cursor: 'grab'
};

TypeScript

deliveryVehicleMarkerCustomization = {
  cursor: 'grab'
};

पसंद के मुताबिक बनाने वाले फ़ंक्शन का इस्तेमाल करके मार्कर की स्टाइल बदलें

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

JavaScript

vehicleMarkerCustomization =
  (params) => {
    var distance = params.trip.remainingWaypoints.length;
    params.marker.setLabel(`${distance}`);
  };

TypeScript

vehicleMarkerCustomization =
  (params: TripMarkerCustomizationFunctionParams) => {
    const distance = params.trip.remainingWaypoints.length;
    params.marker.setLabel(`${distance}`);
};

मार्कर में क्लिक हैंडलिंग जोड़ें

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

JavaScript

vehicleMarkerCustomization =
  (params) => {
    if (params.isNew) {
      params.marker.addListener('click', () => {
        // Perform desired action.
      });
    }
  };

TypeScript

vehicleMarkerCustomization =
  (params: TripMarkerCustomizationFunctionParams) => {
    if (params.isNew) {
      params.marker.addListener('click', () => {
        // Perform desired action.
      });
    }
  };

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