ঘোষণা: নতুন বেসম্যাপ স্টাইলিং শীঘ্রই গুগল ম্যাপ প্ল্যাটফর্মে আসছে। মানচিত্র স্টাইলিংয়ের এই আপডেটে একটি নতুন ডিফল্ট রঙ প্যালেট, আধুনিক পিন এবং মানচিত্রের অভিজ্ঞতা এবং ব্যবহারযোগ্যতার উন্নতি অন্তর্ভুক্ত রয়েছে। সমস্ত মানচিত্রের শৈলী মার্চ 2025-এ স্বয়ংক্রিয়ভাবে আপডেট হবে। প্রাপ্যতা এবং আগে কীভাবে নির্বাচন করবেন সে সম্পর্কে আরও তথ্যের জন্য, Google Maps প্ল্যাটফর্মের জন্য নতুন মানচিত্রের শৈলী দেখুন।

এই পৃষ্ঠাটি Cloud Translation API অনুবাদ করেছে।

ওভারভিউ

Maps JavaScript API-এর জন্য WebGL-চালিত বৈশিষ্ট্যগুলি আপনাকে কাত এবং ঘূর্ণন নিয়ন্ত্রণ করতে, মানচিত্রে সরাসরি 3D বস্তু যোগ করতে এবং আরও অনেক কিছু করতে দেয়৷ নিম্নলিখিত বৈশিষ্ট্য অন্তর্ভুক্ত করা হয়:

WebGL ওভারলে ভিউ আপনাকে আপনার মানচিত্রে কাস্টম 2D এবং 3D গ্রাফিক্স এবং অ্যানিমেটেড সামগ্রী যোগ করতে দেয়৷
কাত এবং শিরোনাম এখন প্রোগ্রামগতভাবে সামঞ্জস্য করা যেতে পারে, এবং মাউস এবং কীবোর্ড অঙ্গভঙ্গি ব্যবহার করে।
map.moveCamera() আপনাকে একই সাথে একাধিক ক্যামেরা বৈশিষ্ট্য পরিবর্তন করতে দেয়।
জুম এখন ভগ্নাংশ মান সমর্থন করে।

শুরু করুন

নতুন WebGL বৈশিষ্ট্যগুলি ব্যবহার করার জন্য, আপনাকে অবশ্যই একটি ভেক্টর মানচিত্র ব্যবহার করতে হবে৷ এই বিভাগে আপনি কিভাবে দেখায়.

`renderingType` বিকল্পটি নির্দিষ্ট করুন

আপনার মানচিত্রের জন্য রাস্টার বা ভেক্টর রেন্ডারিং প্রকার নির্দিষ্ট করতে renderingType বিকল্পটি ব্যবহার করুন (কোনও মানচিত্র আইডি প্রয়োজন নেই):

RenderingType লাইব্রেরি লোড করুন; মানচিত্র লাইব্রেরি লোড করার সময় এটি করা যেতে পারে:
```
const { Map, RenderingType } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary;
```
মানচিত্র শুরু করার সময়, RenderingType.VECTOR বা RenderingType.RASTER উল্লেখ করতে renderingType বিকল্পটি ব্যবহার করুন :
```
map = new Map(
  document.getElementById('map') as HTMLElement,
  {
    zoom: 4,
    center: position,
    renderingType: RenderingType.VECTOR,
  }
);
```

renderingType বিকল্পটি মানচিত্র আইডি কনফিগার করে তৈরি যেকোন রেন্ডারিং টাইপ সেটিংসকে ওভাররাইড করে।

কাত এবং ঘূর্ণন সক্ষম করতে, tiltInteractionEnabled মানচিত্র বিকল্পটিকে সত্যে সেট করুন বা map.setTiltInteractionEnabled কল করুন।
প্যানিং সক্ষম করতে, headingInteractionEnabled মানচিত্র বিকল্পটিকে true সেট করুন বা map.setHeadingInteractionEnabled কল করুন।

রেন্ডারিং টাইপ সেট করতে একটি মানচিত্র আইডি ব্যবহার করুন

আপনি একটি মানচিত্র আইডি ব্যবহার করে রেন্ডারিং টাইপও নির্দিষ্ট করতে পারেন। একটি নতুন মানচিত্র আইডি তৈরি করতে, ক্লাউড-ভিত্তিক মানচিত্র স্টাইলিং-এর ধাপগুলি অনুসরণ করুন - একটি মানচিত্র আইডি পান । মানচিত্র প্রকারটি JavaScript- এ সেট করতে ভুলবেন না এবং ভেক্টর বিকল্পটি নির্বাচন করুন। মানচিত্রে কাত এবং ঘূর্ণন সক্ষম করতে টিল্ট এবং/অথবা ঘূর্ণন পরীক্ষা করুন। এটি করার ফলে আপনি এই মানগুলিকে প্রোগ্রাম্যাটিকভাবে সামঞ্জস্য করতে পারবেন এবং ব্যবহারকারীদের সরাসরি মানচিত্রে কাত এবং শিরোনাম সামঞ্জস্য করতে দেয়৷ যদি টিল্ট বা শিরোনাম ব্যবহার আপনার অ্যাপকে বিরূপভাবে প্রভাবিত করে, তাহলে টিল্ট এবং রোটেশন চেক না করে রাখুন যাতে ব্যবহারকারীরা কাত এবং ঘূর্ণন সামঞ্জস্য করতে সক্ষম হবে না।

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

এরপরে, আপনার তৈরি করা মানচিত্র ID দিয়ে আপনার মানচিত্র আরম্ভ করার কোড আপডেট করুন। আপনি মানচিত্র ব্যবস্থাপনা পৃষ্ঠায় আপনার মানচিত্র IDs খুঁজে পেতে পারেন. এখানে দেখানো হিসাবে mapId প্রপার্টি ব্যবহার করে ম্যাপ ইনস্ট্যান্টিয়েট করার সময় একটি ম্যাপ আইডি প্রদান করুন:

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

`<gmp-map>` উপাদান ব্যবহার করুন

তিনি <gmp-map> উপাদান ব্যবহার করার সময় ভেক্টর মানচিত্র, টিল্ট এবং শিরোনাম ডিফল্টরূপে সক্রিয় থাকে, যা আপনাকে HTML ব্যবহার করে আপনার পৃষ্ঠায় একটি মানচিত্র যোগ করতে দেয়। আরও জানুন

উদাহরণ

এই বৈশিষ্ট্যগুলি প্রদর্শন করার জন্য উদাহরণ প্রদান করা হয়েছে: