এবার শুরু করা যাক

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

উন্নত মার্কারগুলির সাথে সেট আপ করতে এই পদক্ষেপগুলি অনুসরণ করুন৷

একটি API কী পান এবং মানচিত্র জাভাস্ক্রিপ্ট API সক্ষম করুন৷

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

একটি API কী পান

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

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

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

আপনার মানচিত্র প্রারম্ভিক কোড আপডেট করুন

এর জন্য আপনার তৈরি করা মানচিত্র ID প্রয়োজন। এটি আপনার মানচিত্র ব্যবস্থাপনা পৃষ্ঠায় পাওয়া যাবে।

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

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

    const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
    
  3. mapId প্রপার্টি ব্যবহার করে ম্যাপ ইনস্ট্যান্টিয়েট করার সময় একটি ম্যাপ আইডি প্রদান করুন। এটি আপনার প্রদান করা একটি মানচিত্র ID বা 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'
    });

মানচিত্রের ক্ষমতা পরীক্ষা করুন (ঐচ্ছিক)

উন্নত মার্কারগুলির একটি মানচিত্র আইডি প্রয়োজন৷ যদি মানচিত্র আইডি অনুপস্থিত থাকে, বা একটি অবৈধ মানচিত্র আইডি পাস করা হয়, উন্নত মার্কারগুলি লোড করতে পারে না৷ একটি সমস্যা সমাধানের পদক্ষেপ হিসাবে, আপনি মানচিত্র ক্ষমতা পরিবর্তনের সদস্যতা নিতে একটি mapcapabilities_changed শ্রোতা যোগ করতে পারেন। এটি নির্দেশ করবে যে নিম্নলিখিত শর্তগুলি পূরণ করা হয়েছে কিনা:

  • একটি বৈধ মানচিত্র আইডি ব্যবহার করা হচ্ছে৷
  • মানচিত্র ID একটি ভেক্টর মানচিত্রের সাথে যুক্ত হয়, যদি একটি ভেক্টর মানচিত্রের প্রয়োজনীয় বৈশিষ্ট্যগুলি ব্যবহার করা হয়।

মানচিত্র ক্ষমতা ব্যবহার করা ঐচ্ছিক, এবং শুধুমাত্র পরীক্ষা এবং সমস্যা সমাধানের উদ্দেশ্যে বা রানটাইম ফলব্যাক উদ্দেশ্যে সুপারিশ করা হয়।

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

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

একটি ডিফল্ট উন্নত মার্কার তৈরি করুন