माइग्रेशन: google.load में Maps मॉड्यूल

हम 13 अक्टूबर, 2021 को google.load के लिए "Maps" मॉड्यूल उपलब्ध कराने वाली सेवा बंद कर देंगे. इसका मतलब है कि 13 अक्टूबर, 2021 के बाद, google.load में "Maps" मॉड्यूल का इस्तेमाल करने पर आपको गड़बड़ी का मैसेज मिलेगा. इसमें लिखा होगा कि मॉड्यूल "maps" काम नहीं करता. साथ ही, कोई भी मैप लोड नहीं होगा. आपको किसी दूसरे विकल्प पर स्विच करना होगा, ताकि आपको कोई समस्या न हो.

मुझे क्या करना होगा?

सबसे पहले, <script> टैग हटाएं, जो google.load लोडर को लोड करता है. इसके बाद, google.load को कॉल करने की सुविधा हटाएं. अगर Google Loader का इस्तेमाल अन्य कामों के लिए किया जा रहा है, तो लोडर <script> टैग को अपनी जगह पर ही रहने दें.

इसके बाद, Maps JavaScript API को लोड करने का नया तरीका लागू करें. इसके लिए, इनमें से कोई एक विकल्प चुनें:

• <script> टैग का इस्तेमाल करके इनलाइन लोडिंग
• किसी दूसरी JavaScript फ़ाइल से डाइनैमिक लोडिंग

Google Loader का इस्तेमाल करने का मौजूदा उदाहरण

यहां दिए गए उदाहरण में दिखाया गया है कि Maps JavaScript API को लोड करने के लिए, Google Loader का इस्तेमाल कैसे किया जाता है. इसमें दो <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>

इसके बाद, अपने JavaScript कोड में से google.load फ़ंक्शन कॉल को हटा दें, क्योंकि अब इसकी ज़रूरत नहीं है. यहां दिए गए उदाहरण में, एक खाली initMap() फ़ंक्शन दिखाया गया है. Maps लाइब्रेरी के लोड होने पर इसे कॉल किया जाता है:

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

दस्तावेज़ देखें

किसी दूसरी JavaScript फ़ाइल से डाइनैमिक लोडिंग

डाइनैमिक लोडिंग की मदद से, यह कंट्रोल किया जा सकता है कि Maps JavaScript API कब लोड होगा. उदाहरण के लिए, Maps JavaScript API को तब तक लोड न करें, जब तक उपयोगकर्ता किसी बटन पर क्लिक नहीं करता या कोई दूसरी कार्रवाई नहीं करता. डाइनैमिक लोडिंग को लागू करने के लिए, सबसे पहले <script> टैग को बदलें. यह टैग www.google.com/jsapi ("before") को लोड करता है. इसके बाद, प्रोग्राम के हिसाब से <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);

दस्तावेज़ देखें