google.maps.OverlayView व्युत्पन्न कक्षा

Question

लोड करने से पहले Google मानचित्र एपीआई लोड होने तक प्रतीक्षा कैसे करें मेरे पास एक अलग लेबल.जेएस फ़ाइल है जिसमें मैंने एक कस्टम ओवरले परिभाषित किया है। यह अपने प्रोटोटाइप के रूप में google.maps.OverlayView उपयोग करता है:

Label.prototype = new google.maps.OverlayView(); 

मुझे यकीन है कि यह मेरा index.html फ़ाइल में फ़ाइल जे एस के लिए जहां स्क्रिप्ट टैग जगह नहीं हूँ। जबकि मैप्स एपीआई अभी तक भरी हुई एक त्रुटि के कारण नहीं है

.... 
     <script async defer 
      src="https://maps.googleapis.com/maps/api/js?... 
     </script> 
     <script src="js/label.js"></script> 
    </body> 
</html> 

label.js फ़ाइल तुरंत भरी हुई है: मैं गूगल मैप्स नीचे स्क्रिप्ट टैग तो जैसे टैग लोड हो रहा है जगह।

मैं वर्तमान में हस्तचालित रूप से अपने नक्शे में लोड कॉलबैक जे एस लोड करके इस का समाधान:

function initMap() { 
    gMap = new google.maps.Map(document.getElementById(strMapDivName), { 
     center: {lat: 21, lng: 78}, 
     mapTypeId: google.maps.MapTypeId.HYBRID, 
     zoom: 6, 
     heading: 90, 
     tilt: 0 
    }); 

    // Load label.js afterwards so we can be sure that the google maps api has loaded 
    var fileref=document.createElement('script') 
    fileref.setAttribute("type","text/javascript") 
    fileref.setAttribute("src", "js/label.js") 

    document.getElementsByTagName("head")[0].appendChild(fileref) 

} 

इस इस को हल करने के लिए सबसे अच्छा तरीका है?

Answer 1

मुझे लगता है कि आप जिस तरह से करते हैं वह ठीक है। यदि आप यह सुनिश्चित करना चाहते हैं कि नक्शा वस्तु तैयार है, तो आप मानचित्र idle ईवेंट श्रोता का भी उपयोग कर सकते हैं।

google.maps.event.addListenerOnce(map, 'idle', function() { 
    // map is ready 
}); 

Answer 2

यहां एक सामान्य है जिसे मैंने बनाया और मेरे लिए काम करता है।

1) समारोह आप निष्पादित करने के लिए के बाद गूगल के नक्शे लोड किया जाता है चाहता हूँ को परिभाषित करें

function ToExecuteAfterLoaded() 
    { 
    // Doing something here /// 
    console.log("Executing this function"); // per example // 
    } 

2) प्रतीक्षा की जा रही समारोह

function WhenGoogleLoadedDo(fnt) 
    { 
    if(typeof google != 'undefined') 
     fnt(); 
    else 
     setTimeout(function() 
     {(function(fnt) 
      { 
      WhenGoogleLoadedDo(fnt) 
      })(fnt)}, 500); // You can set timer as you wish // 
    } 

3) अपनी स्क्रिप्ट में इस तरह ToExecuteAfterLoaded कॉल

WhenGoogleLoadedDo(ToExecuteAfterLoaded); 

Answer 3

DOMContentLoaded के साथ अपने कस्टम लेबल को लपेटने के बारे में क्या?

 document.addEventListener("DOMContentLoaded", function(event) { 
      Label.prototype = new google.maps.OverlayView(); 
     }); 

संदर्भ: https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded