মার্কার ওভারভিউ

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

একটি মানচিত্রে একক অবস্থান প্রদর্শন করতে মার্কার ব্যবহার করুন। এই নির্দেশিকা আপনাকে দেখায় কিভাবে উন্নত মার্কার ব্যবহার করতে হয়। উন্নত মার্কারগুলির সাহায্যে আপনি অত্যন্ত কার্যকরী মার্কারগুলি তৈরি এবং কাস্টমাইজ করতে পারেন এবং অ্যাক্সেসযোগ্য মার্কারগুলি তৈরি করতে পারেন যা DOM ক্লিক ইভেন্ট এবং কীবোর্ড ইনপুটে প্রতিক্রিয়া জানায়৷ আরও গভীর কাস্টমাইজেশনের জন্য, উন্নত মার্কারগুলি সম্পূর্ণ কাস্টম মার্কার তৈরি করার ক্ষমতা সহ কাস্টম HTML এবং CSS ব্যবহার সমর্থন করে৷ 3D অ্যাপ্লিকেশনের জন্য আপনি একটি মার্কার প্রদর্শিত উচ্চতা নিয়ন্ত্রণ করতে পারেন। উন্নত মার্কারগুলি রাস্টার এবং ভেক্টর মানচিত্রে সমর্থিত (যদিও কিছু বৈশিষ্ট্য রাস্টার মানচিত্রে উপলব্ধ নয়)। উন্নত মার্কার ব্যবহার করার জন্য একটি মানচিত্র ID প্রয়োজন ( DEMO_MAP_ID ব্যবহার করা যেতে পারে)।

উন্নত মার্কার দিয়ে শুরু করুন

রঙ, স্কেল, এবং আইকন ইমেজ কাস্টমাইজ করুন

ডিফল্ট মার্কারের ব্যাকগ্রাউন্ড, গ্লিফ এবং বর্ডার কালার কাস্টমাইজ করুন এবং মার্কার সাইজ অ্যাডজাস্ট করুন।

কিছু কাস্টমাইজড মার্কার দেখানো একটি স্ক্রিনশট।

একটি কাস্টম SVG বা PNG ইমেজ দিয়ে ডিফল্ট মার্কার আইকন প্রতিস্থাপন করুন।

কাস্টম SVG মার্কার দেখানো একটি স্ক্রিনশট।

কাস্টম HTML মার্কার তৈরি করুন

দৃশ্যত স্বতন্ত্র ইন্টারেক্টিভ মার্কার তৈরি করতে এবং অ্যানিমেশন তৈরি করতে কাস্টম HTML এবং CSS ব্যবহার করুন।

একটি কাস্টম HTML মার্কার দেখানো একটি স্ক্রিনশট৷

ক্লিক এবং কীবোর্ড ইভেন্টে মার্কারদের সাড়া দিন

একটি click ইভেন্ট লিসেনার যোগ করে ক্লিক এবং কীবোর্ড ইভেন্টগুলিতে একটি মার্কার প্রতিক্রিয়া তৈরি করুন৷

function initMap() {
  const map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: 37.4239163, lng: -122.0947209},
    zoom: 17,
    mapId: 'DEMO_MAP_ID',
  });

  const marker = new google.maps.marker.AdvancedMarkerElement({
    map,
    position: {lat: 37.4239163, lng: -122.0947209},
  });

  marker.addListener('click', ({domEvent, latLng}) => {
    const {target} = domEvent;
    // Handle the click event.
    // ...
  });
}

মার্কার উচ্চতা এবং সংঘর্ষের আচরণ সেট করুন

3D মানচিত্রের উপাদানগুলির সাথে সঠিকভাবে প্রদর্শিত করার জন্য একটি মার্কারটির উচ্চতা সেট করুন এবং একটি মার্কার যখন অন্য মার্কার বা মানচিত্রের লেবেলের সাথে সংঘর্ষ হয় তখন এটি কীভাবে আচরণ করা উচিত তা নির্দিষ্ট করুন৷ মার্কার উচ্চতা শুধুমাত্র ভেক্টর মানচিত্রে সমর্থিত।

একটি উচ্চতা-সামঞ্জস্যযুক্ত মার্কার দেখানো একটি স্ক্রিনশট৷

পরবর্তী পর্ব