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

প্ল্যাটফর্ম বেছে নিন: Android iOS JavaScript

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

পরামর্শ: আপনার ম্যাপে লিগেসি মার্কার ব্যবহার করা হলে, উন্নত মার্কার ব্যবহার করার কথা বিবেচনা করুন।

উন্নত মার্কার ব্যবহার করা শুরু করা

রঙ, স্কেল ও আইকন ছবি কাস্টমাইজ করা

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

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

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

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

ক্লিক ও কীবোর্ড ইভেন্টে মার্কারকে প্রতিক্রিয়া জানাতে বাধ্য করা

gmp-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.addEventListener('gmp-click', (event) => {
    // Handle the click event.
    // ...
  });
}

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

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

পরের ধাপ

• উন্নত মার্কার ব্যবহার শুরু করা