শুরু করুন

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

উন্নত মার্কার ব্যবহারের জন্য এই ধাপগুলো অনুসরণ করুন।

একটি API কী নিন এবং Maps JavaScript API সক্রিয় করুন।

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

একটি এপিআই কী পান

একটি মানচিত্র আইডি তৈরি করুন

একটি নতুন ম্যাপ আইডি তৈরি করতে, ক্লাউড কাস্টমাইজেশন- এর ধাপগুলো অনুসরণ করুন। ম্যাপ টাইপ জাভাস্ক্রিপ্ট- এ সেট করুন এবং ভেক্টর অথবা রাস্টার অপশনটি নির্বাচন করুন।

গুরুত্বপূর্ণ: পরীক্ষার জন্য, আপনি আপনার অ্যাপ কোডে mapId: 'DEMO_MAP_ID' ব্যবহার করে ম্যাপ আইডি তৈরি এবং কনফিগার করার ধাপটি এড়িয়ে যেতে পারেন।

আপনার ম্যাপ ইনিশিয়ালাইজেশন কোড আপডেট করুন

এর জন্য আপনার এইমাত্র তৈরি করা ম্যাপ আইডিটি প্রয়োজন। এটি আপনার ম্যাপস ম্যানেজমেন্ট পেজে পাওয়া যাবে।

1. Maps JavaScript API লোড করুন ।

2. প্রয়োজনে একটি async ফাংশনের ভেতর থেকে অ্যাডভান্সড মার্কার লাইব্রেরিটি লোড করুন:

   const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;

3. mapId প্রপার্টি ব্যবহার করে ম্যাপটি ইনস্ট্যানশিয়েট করার সময় একটি ম্যাপ আইডি প্রদান করুন। এটি আপনার দেওয়া কোনো ম্যাপ আইডি অথবা DEMO_MAP_ID ​​হতে পারে।

   const map = new
   google.maps.Map(document.getElementById('map'), {
     center: {lat: -34.397, lng: 150.644},
     zoom: 8,
     mapId: 'YOUR_MAP_ID'
   });

সতর্কতা: অ্যাডভান্সড মার্কারের জন্য ব্যবহৃত উদাহরণ ম্যাপগুলোতে এমন ম্যাপ আইডি ব্যবহার করা হয়েছে যা একটি সীমিত-POI ম্যাপ স্টাইলের সাথে সংযুক্ত। আপনি যদি উদাহরণ কোড পুনরায় ব্যবহার করেন, তাহলে আমরা এই ম্যাপ আইডিগুলোকে DEMO_MAP_ID অথবা আপনার নিজস্ব ম্যাপ আইডি দিয়ে প্রতিস্থাপন করার পরামর্শ দিই।

মানচিত্রের সক্ষমতা যাচাই করুন (ঐচ্ছিক)

অ্যাডভান্সড মার্কারের জন্য একটি ম্যাপ আইডি প্রয়োজন। ম্যাপ আইডি না থাকলে, অ্যাডভান্সড মার্কার লোড হতে পারে না। সমস্যা সমাধানের একটি পদক্ষেপ হিসেবে, আপনি ম্যাপ ক্যাপাবিলিটির পরিবর্তনগুলিতে সাবস্ক্রাইব করার জন্য একটি mapcapabilities_changed লিসেনার যোগ করতে পারেন। ম্যাপ ক্যাপাবিলিটি ব্যবহার করা ঐচ্ছিক এবং এটি শুধুমাত্র পরীক্ষা ও সমস্যা সমাধানের উদ্দেশ্যে, অথবা রানটাইম ফলব্যাকের জন্য সুপারিশ করা হয়।

// Optional: subscribe to map capability changes.
map.addListener('mapcapabilities_changed', () => {
  const mapCapabilities = map.getMapCapabilities();

  if (!mapCapabilities.isAdvancedMarkersAvailable) {
    // Advanced markers are *not* available, add a fallback.
  }
});

পরবর্তী পদক্ষেপ

মানচিত্রে একটি মার্কার যোগ করুন