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

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

ভেক্টর মানচিত্র

মানচিত্র জাভাস্ক্রিপ্ট API মানচিত্রের দুটি ভিন্ন বাস্তবায়ন অফার করে: রাস্টার এবং ভেক্টর। রাস্টার মানচিত্রটি ডিফল্টরূপে লোড করা হয় এবং মানচিত্রটিকে পিক্সেল-ভিত্তিক রাস্টার ইমেজ টাইলসের গ্রিড হিসাবে লোড করে, যা Google মানচিত্র প্ল্যাটফর্ম সার্ভার-সাইড দ্বারা তৈরি হয়, তারপর আপনার ওয়েব অ্যাপে পরিবেশন করা হয়। ভেক্টর মানচিত্র হল ভেক্টর-ভিত্তিক টাইলগুলির সমন্বয়ে গঠিত, যা WebGL ব্যবহার করে ক্লায়েন্ট-সাইডে লোডের সময় আঁকা হয়, একটি ওয়েব প্রযুক্তি যা ব্রাউজারকে 2D এবং 3D গ্রাফিক্স রেন্ডার করার জন্য ব্যবহারকারীর ডিভাইসে GPU অ্যাক্সেস করতে দেয়।

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

ভেক্টর মানচিত্র দিয়ে শুরু করুন

ক্যামেরা নিয়ন্ত্রণ করুন

একবারে ক্যামেরা বৈশিষ্ট্যগুলির যেকোনো সমন্বয় আপডেট করতে map.moveCamera() ফাংশনটি ব্যবহার করুন৷ map.moveCamera() আপডেট করার জন্য ক্যামেরার সমস্ত বৈশিষ্ট্য ধারণকারী একটি একক প্যারামিটার গ্রহণ করে। নিম্নোক্ত উদাহরণটি দেখায় কলিং map.moveCamera() center , zoom , heading এবং একবারে tilt :

map.moveCamera({
  center: new google.maps.LatLng(37.7893719, -122.3942),
  zoom: 16,
  heading: 320,
  tilt: 47.5
});

আপনি একটি অ্যানিমেশন লুপ সহ map.moveCamera() কল করে ক্যামেরা বৈশিষ্ট্যগুলিকে অ্যানিমেট করতে পারেন, যেমনটি এখানে দেখানো হয়েছে:

const degreesPerSecond = 3;

function animateCamera(time) {
  // Update the heading, leave everything else as-is.
  map.moveCamera({
    heading: (time / 1000) * degreesPerSecond
  });

  requestAnimationFrame(animateCamera);
}

// Start the animation.
requestAnimationFrame(animateCamera);

ভগ্নাংশ জুম

ভেক্টর মানচিত্র ভগ্নাংশ জুম সমর্থন করে, যা আপনাকে পূর্ণসংখ্যার পরিবর্তে ভগ্নাংশের মান ব্যবহার করে জুম করতে দেয়। রাস্টার এবং ভেক্টর মানচিত্র উভয়ই ভগ্নাংশ জুম সমর্থন করে, ভেক্টর মানচিত্রের জন্য ডিফল্টরূপে ভগ্নাংশ জুম চালু থাকে এবং রাস্টার মানচিত্রের জন্য ডিফল্টরূপে বন্ধ থাকে। ভগ্নাংশ জুম চালু এবং বন্ধ করতে isFractionalZoomEnabled মানচিত্র বিকল্পটি ব্যবহার করুন।

নিম্নলিখিত উদাহরণ মানচিত্র শুরু করার সময় ভগ্নাংশ জুম সক্ষম দেখায়:

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

আপনি এখানে দেখানো হিসাবে isFractionalZoomEnabled মানচিত্র বিকল্প সেট করে ভগ্নাংশ জুম চালু এবং বন্ধ করতে পারেন:

// Using map.set
map.set('isFractionalZoomEnabled', true);

// Using map.setOptions
map.setOptions({isFractionalZoomEnabled: true});

ভগ্নাংশ জুম চালু আছে কিনা তা সনাক্ত করতে আপনি একজন শ্রোতা সেট করতে পারেন; এটি সবচেয়ে কার্যকর যদি আপনি স্পষ্টভাবে isFractionalZoomEnabled true বা false সেট না করে থাকেন। ভগ্নাংশ জুম সক্ষম কিনা তা দেখতে নিম্নলিখিত উদাহরণ কোডটি পরীক্ষা করে:

map.addListener('isfractionalzoomenabled_changed', () => {
  const isFractionalZoomEnabled = map.get('isFractionalZoomEnabled');
  if (isFractionalZoomEnabled === false) {
    console.log('not using fractional zoom');
  } else if (isFractionalZoomEnabled === true) {
    console.log('using fractional zoom');
  } else {
    console.log('map not done initializing yet');
  }
});

ভেক্টর মানচিত্র দিয়ে শুরু করুন

ক্যামেরা নিয়ন্ত্রণ করুন

map.moveCamera({
  center: new google.maps.LatLng(37.7893719, -122.3942),
  zoom: 16,
  heading: 320,
  tilt: 47.5
});

আপনি একটি অ্যানিমেশন লুপ দিয়ে map.moveCamera() কল করে ক্যামেরা বৈশিষ্ট্যগুলিকে অ্যানিমেট করতে পারেন, যেমনটি এখানে দেখানো হয়েছে:

const degreesPerSecond = 3;

function animateCamera(time) {
  // Update the heading, leave everything else as-is.
  map.moveCamera({
    heading: (time / 1000) * degreesPerSecond
  });

  requestAnimationFrame(animateCamera);
}

// Start the animation.
requestAnimationFrame(animateCamera);

ভগ্নাংশ জুম

নিম্নলিখিত উদাহরণ মানচিত্র শুরু করার সময় ভগ্নাংশ জুম সক্ষম দেখায়:

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

// Using map.set
map.set('isFractionalZoomEnabled', true);

// Using map.setOptions
map.setOptions({isFractionalZoomEnabled: true});

map.addListener('isfractionalzoomenabled_changed', () => {
  const isFractionalZoomEnabled = map.get('isFractionalZoomEnabled');
  if (isFractionalZoomEnabled === false) {
    console.log('not using fractional zoom');
  } else if (isFractionalZoomEnabled === true) {
    console.log('using fractional zoom');
  } else {
    console.log('map not done initializing yet');
  }
});