মাইগ্রেশন: google.load এ ম্যাপ মডিউল

১৩ অক্টোবর, ২০২১ তারিখে, আমরা google.load এর জন্য "Maps" মডিউল সরবরাহকারী পরিষেবাটি বন্ধ করে দেব। এর অর্থ হল, ১৩ অক্টোবর, ২০২১ এর পরে, যদি আপনি google.load এ "Maps" মডিউলটি ব্যবহার করার চেষ্টা করেন তবে আপনি একটি ত্রুটি পাবেন ( মডিউল "maps" সমর্থিত নয় ), এবং কোনও মানচিত্র লোড হবে না। সম্ভাব্য ভাঙ্গন এড়াতে, আপনাকে বিকল্পগুলির একটিতে স্যুইচ করতে হবে।

আমাকে কি করতে হবে?

প্রথমে, google.load লোডার লোড করে এমন <script> ট্যাগটি সরিয়ে ফেলুন, তারপর google.load এ কলগুলি সরিয়ে ফেলুন। আপনি যদি অন্য কোনও কাজের জন্য Google Loader ব্যবহার করেন, তাহলে loader <script> ট্যাগটি রেখে দেওয়া ঠিক আছে।

এরপর, Maps JavaScript API লোড করার জন্য একটি নতুন উপায় বাস্তবায়ন করুন (নিম্নলিখিত বিকল্পগুলির মধ্যে একটি নির্বাচন করুন):

• <script> ট্যাগ ব্যবহার করে ইনলাইন লোডিং
• অন্য জাভাস্ক্রিপ্ট ফাইল থেকে ডায়নামিক লোডিং

গুগল লোডার ব্যবহারের বর্তমান উদাহরণ

নিম্নলিখিত উদাহরণটি দেখায় যে গুগল লোডার বর্তমানে ম্যাপস জাভাস্ক্রিপ্ট এপিআই লোড করার জন্য কীভাবে ব্যবহৃত হয় (দুটি <script> ব্লক রয়েছে):

আগে

<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load("maps", "3.exp", {
    "callback": initMap,
    "key": "YOUR_KEY",
    "libraries": "places,visualization"
});
function initMap() {
  // Google Maps JS API is loaded and available
}
</script>

<script> ট্যাগ ব্যবহার করে ইনলাইন লোডিং (প্রস্তাবিত)

যখন এই পদ্ধতি ব্যবহার করা হয়, তখন পৃষ্ঠা লোড হওয়ার সাথে সাথে Maps JavaScript API লোড হয়। ইনলাইন লোডিং বাস্তবায়ন করতে, প্রথমে www.google.com/jsapi ( "before" ) ​​লোড করে এমন <script> ট্যাগটি নিম্নলিখিত উদাহরণে দেখানো <script> ট্যাগ দিয়ে প্রতিস্থাপন করুন:

<script async src="https://maps.googleapis.com/maps/api/js?libraries=places,visualization&key=YOUR_API_KEY&v=weekly&callback=initMap">
</script>

তারপর আপনার জাভাস্ক্রিপ্ট কোড থেকে, google.load ফাংশন কলটি সরিয়ে ফেলুন, কারণ এটির আর প্রয়োজন নেই। নিম্নলিখিত উদাহরণে একটি ফাঁকা initMap() ফাংশন দেখানো হয়েছে, যা Maps লাইব্রেরি সফলভাবে লোড হলে কল করা হয়:

<script type='text/javascript'>
function initMap() {
  // Google Maps JS API is loaded and available
}
</script>

ডকুমেন্টেশন দেখুন

অন্য জাভাস্ক্রিপ্ট ফাইল থেকে ডায়নামিক লোডিং

ডায়নামিক লোডিং আপনাকে ম্যাপস জাভাস্ক্রিপ্ট এপিআই কখন লোড হবে তা নিয়ন্ত্রণ করতে দেয়। উদাহরণস্বরূপ, ব্যবহারকারী একটি বোতামে ক্লিক না করা বা অন্য কোনও ক্রিয়া সম্পাদন না করা পর্যন্ত আপনি ম্যাপস জাভাস্ক্রিপ্ট এপিআই লোড করার জন্য অপেক্ষা করতে পারেন। ডায়নামিক লোডিং বাস্তবায়ন করতে, প্রথমে www.google.com/jsapi ( "before" ) ​​লোড করে এমন <script> ট্যাগটি কোড দিয়ে প্রতিস্থাপন করুন এবং প্রোগ্রাম্যাটিকভাবে <script> ট্যাগ যুক্ত করুন, যেমনটি নিম্নলিখিত উদাহরণে দেখানো হয়েছে:

var script = document.createElement('script');
script.src =
'https://maps.googleapis.com/maps/api/js?libraries=places,visualization&key=YOUR_API_KEY&v=weekly&callback=initMap';
script.async=true;

তারপর আপনার কলব্যাক ফাংশনটি উইন্ডো অবজেক্টের সাথে এভাবে সংযুক্ত করুন:

window.initMap = function() {
  // Google Maps JS API is loaded and available
};

অবশেষে, পৃষ্ঠার হেডারে <script> ট্যাগটি এভাবে যোগ করুন:

document.head.appendChild(script);

ডকুমেন্টেশন দেখুন