মার্কার কাস্টমাইজ করুন

মানচিত্রে যোগ করা মার্কারগুলির চেহারা এবং অনুভূতি কাস্টমাইজ করুন। মানচিত্রে যোগ করা মার্কারগুলির চেহারা এবং অনুভূতি দুটি উপায়ে কাস্টমাইজ করুন:

1. ধরণের উপর ভিত্তি করে স্টাইল মার্কার : একই ধরণের স্টাইল মার্কারে একটি MarkerOptions অবজেক্ট নির্দিষ্ট করুন। আপনার নির্দিষ্ট করা পরিবর্তনগুলি প্রতিটি মার্কার তৈরি হওয়ার পরে প্রয়োগ করা হয়, যেকোনো ডিফল্ট বিকল্প ওভাররাইট করে। উদাহরণস্বরূপ, এই নির্দেশিকায় MarkerOptions ব্যবহার করে মার্কারগুলির স্টাইল পরিবর্তন দেখুন।

2. ডেটা ভিত্তিক স্টাইল মার্কার : ডেটা ভিত্তিক স্টাইল মার্কারগুলির জন্য একটি কাস্টমাইজেশন ফাংশন নির্দিষ্ট করুন। আপনি যাত্রা ভাগ করে নেওয়ার তথ্য বা বাইরের উৎস থেকে প্রাপ্ত ডেটার উপর ভিত্তি করে স্টাইল করতে পারেন:

   • ট্রিপ শেয়ারিং থেকে প্রাপ্ত ডেটা : ট্রিপ শেয়ারিং মার্কার ডেটা কাস্টমাইজেশন ফাংশনে প্রেরণ করে, যার মধ্যে রয়েছে মার্কারটি কোন ধরণের বস্তুর প্রতিনিধিত্ব করে: যানবাহন, উৎপত্তিস্থল, ওয়েপয়েন্ট বা গন্তব্য। মার্কার স্টাইলিং তারপর মার্কার উপাদানের বর্তমান অবস্থার উপর ভিত্তি করে পরিবর্তিত হয়। উদাহরণস্বরূপ, গাড়িটি ট্রিপ শেষ না হওয়া পর্যন্ত অবশিষ্ট ওয়েপয়েন্টের সংখ্যা।

   • বাইরের উৎস : আপনি ফ্লিট ইঞ্জিনের বাইরের উৎস থেকে প্রাপ্ত তথ্যের সাথে ট্রিপ শেয়ারিং ডেটা একত্রিত করতে পারেন এবং সেই তথ্যের উপর ভিত্তি করে মার্কারও স্টাইল করতে পারেন।

   উদাহরণস্বরূপ, এই নির্দেশিকায় কাস্টমাইজেশন ফাংশন ব্যবহার করে মার্কারগুলির স্টাইলিং পরিবর্তন দেখুন।

3. মার্কারগুলিতে ক্লিক হ্যান্ডলিং যোগ করুন : উদাহরণস্বরূপ, ক্লিক হ্যান্ডলিং যোগ করুন দেখুন।

মার্কার কাস্টমাইজেশন বিকল্পগুলি

উভয় বিকল্পই FleetEngineTripLocationProviderOptions এর অধীনে Google Maps JavaScript API-তে নিম্নলিখিত কাস্টমাইজেশন প্যারামিটার ব্যবহার করে:

• vehicleMarkerCustomization
• originMarkerCustomization
• waypointMarkerCustomization
• destinationMarkerCustomization

MarkerOptions ব্যবহার করে মার্কারগুলির স্টাইলিং পরিবর্তন করুন

নিচের উদাহরণে দেখানো হয়েছে কিভাবে MarkerOptions অবজেক্ট ব্যবহার করে গাড়ির মার্কার স্টাইলিং কনফিগার করতে হয়। Marker কাস্টমাইজেশন অপশনে তালিকাভুক্ত যেকোনো মার্কার কাস্টমাইজেশন ব্যবহার করে যেকোনো মার্কারের স্টাইলিং কাস্টমাইজ করতে এই প্যাটার্নটি অনুসরণ করুন।

deliveryVehicleMarkerCustomization = {
  cursor: 'grab'
};

deliveryVehicleMarkerCustomization = {
  cursor: 'grab'
};

কাস্টমাইজেশন ফাংশন ব্যবহার করে মার্কারগুলির স্টাইলিং পরিবর্তন করুন

নিম্নলিখিত উদাহরণে কাস্টমাইজেশন ফাংশন ব্যবহার করে গাড়ির মার্কার স্টাইলিং কীভাবে কনফিগার করতে হয় তা দেখানো হয়েছে। মার্কার কাস্টমাইজেশন বিকল্পগুলিতে তালিকাভুক্ত যেকোনো মার্কার কাস্টমাইজেশন প্যারামিটার ব্যবহার করে যেকোনো মার্কারের স্টাইলিং কাস্টমাইজ করতে এই প্যাটার্নটি অনুসরণ করুন।

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

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

মার্কারগুলিতে ক্লিক হ্যান্ডলিং যোগ করুন

নিচের উদাহরণে দেখানো হয়েছে কিভাবে গাড়ির মার্কারে ক্লিক হ্যান্ডলিং যোগ করতে হয়। মার্কার কাস্টমাইজেশন অপশনে তালিকাভুক্ত যেকোনো মার্কার কাস্টমাইজেশন প্যারামিটার ব্যবহার করে যেকোনো মার্কারে ক্লিক হ্যান্ডলিং যোগ করতে এই প্যাটার্নটি অনুসরণ করুন।

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

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

এরপর কি?

• রুট পলিলাইন কাস্টমাইজ করুন