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

প্ল্যাটফর্ম নির্বাচন করুন: অ্যান্ড্রয়েড আইওএস জাভাস্ক্রিপ্ট

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

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

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

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

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

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

3. মার্কারে ক্লিক হ্যান্ডলিং যোগ করুন : উদাহরণের জন্য, ‘ক্লিক হ্যান্ডলিং যোগ করুন ’ দেখুন।

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

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

• vehicleMarkerCustomization
• originMarkerCustomization
• waypointMarkerCustomization
• destinationMarkerCustomization

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

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

জাভাস্ক্রিপ্ট

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

এরপর কী?

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