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

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

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

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

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

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>

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

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