मैं यह कैसे जांच सकता हूं कि Google मानचित्र पूरी तरह से लोड है या नहीं?

Question

मैं Google मानचित्र को अपनी वेब साइट में एम्बेड कर रहा हूं। Google मैप लोड होने के बाद, मुझे कुछ जावास्क्रिप्ट प्रक्रियाओं को बंद करने की आवश्यकता है।

क्या Google मैप्स को पूरी तरह से ऑटो-डिटेक्ट करने का एक तरीका है, जिसमें टाइल डाउनलोड और सभी शामिल हैं?

एक tilesloaded()विधि मौजूद है जो इस कार्य को ठीक से पूरा करने वाली है लेकिन यह काम नहीं करती है ।

Comments

"टाइल्स लोड" घटना मेरे लिए काम करने लगती है। यह लोड होता है जब पृष्ठ लोड होता है और जब मैं नक्शे को चारों ओर ले जाता हूं। आपके नक्शे पर, क्या यह सिर्फ असंगत है, या यह कभी काम नहीं करता है?

— क्रिस बी

नहीं, बस नहीं। "टाइल्स लोडेड" जैसा कि यह कहता है कि हर बार नई टाइलें लोड की जाती हैं, जिसका अर्थ है कि यह न केवल पहले लोड पर आग करेगा, बल्कि हर बार जब आप मानचित्र को उस स्थान पर खींचते हैं जहां आपकी टाइलें अभी तक लोड नहीं हुई हैं।

— आइव्स

निर्भर करता है कि क्या आप addListener () या addListenerOnce () का उपयोग करते हैं। आप addListener के बारे में सही हैं () - यही कारण है कि मैं उपयोगgoogle.maps.event.addListenerOnce(map, 'tilesloaded', function() {

— vchrizz

Answer 1

यह मुझे कुछ समय के लिए परेशान कर रहा था GMaps v3 के साथ।

मुझे ऐसा करने का एक तरीका मिला:

google.maps.event.addListenerOnce(map, 'idle', function(){
    // do something only the first time the map is loaded
});

"निष्क्रिय" घटना ट्रिगर होती है जब नक्शा निष्क्रिय स्थिति में जाता है - सब कुछ लोड (या लोड करने में विफल)। मैंने पाया कि यह अधिक विश्वसनीय है फिर टाइल्स लोड / bounds_changed और addListenerOnceविधि का उपयोग करके क्लोजर में कोड को पहली बार "निष्क्रिय" निकाल दिया जाता है और फिर घटना को अलग कर दिया जाता है।

Google मानचित्र संदर्भ में ईवेंट अनुभाग भी देखें ।

Comments

यह तब निकाल दिया जाता है जब मानचित्र निष्क्रिय अवस्था में जाता है (इससे अधिक लोड नहीं होगा)। कभी-कभी कुछ टाइलें हो सकती हैं जो खराब कनेक्शन के कारण लोड नहीं हुई थीं, भले ही ऐसे लापता टुकड़े हों, यह अंत में निष्क्रिय घटना को ट्रिगर करेगा। यदि आपको यह सुनिश्चित करने की आवश्यकता है कि नक्शा पूरा हो गया है, कोई लापता टाइल आदि नहीं है, तो आपको कुछ और तरीका तलाशना चाहिए (उदाहरण के लिए "टाइल लोड किया गया" ईवेंट)।

— दिदनेचेव

यह मेरे लिए काम नहीं कर रहा है .. इससे पहले कि मेरे नक्शे पर कुछ भी दिखाता हो ट्रिगर करता है

— zsitro

-1: टाइलों की तुलना में जल्द ही लोड किए गए / प्रदर्शित किए जाते हैं।

— zbr

-1: क्रोम और फ़ायरफ़ॉक्स में मेरे लिए, यह लगातार स्क्रिप्ट के लोड होते ही आग लग जाती है लेकिन किसी भी टाइल शो से पहले। शायद यह तेज़ कनेक्शन पर स्पष्ट नहीं है, लेकिन मैं बहुत धीमी गति से धन्य हूं। 'टाइल्स लोडेड' हालांकि काम करने लगता है।

— Xananax

उस समाधान के लिए धन्यवाद - मुझे लगता है कि यह वही है जो मुझे चाहिए था। क्या मैं बस अपने सिर को चारों ओर लपेट नहीं सकता, यही कारण है कि पृथ्वी पर Google ने एक साधारण तैयार हुक नहीं डाला है? : -O

— Hasse

Answer 2

मैं एचटीएमएल 5 मोबाइल एप्लिकेशन बना रहा हूं और मुझे लगता है कि देखा idle, bounds_changedऔर tilesloadedघटनाओं आग जब नक्शा वस्तु बनाया है और प्रदान की गई है (भले ही वह दिखाई नहीं देता) है।

अपना मानचित्र रन कोड बनाने के लिए जब यह पहली बार दिखाया गया है तो मैंने निम्नलिखित किया:

google.maps.event.addListenerOnce(map, 'tilesloaded', function(){
    //this part runs when the mapobject is created and rendered
    google.maps.event.addListenerOnce(map, 'tilesloaded', function(){
        //this part runs when the mapobject shown for the first time
    });
});

Comments

पहला टाइल लोड किया गया फ़ंक्शन मेरे लिए अच्छा काम करता है, लेकिन दूसरा टाइल लोड किया गया फ़ंक्शन मेरे लिए कभी नहीं चलता है।

— हंस २

मुझे मिल रहा है Uncaught ReferenceError: map is not defined। मैंने देरी से और अपनी अन्य लिपियों के अंत में स्क्रिप्ट चलाने की कोशिश की है, लेकिन कुछ भी काम नहीं कर रहा है।

— सैम विलिस

यदि आप ईवेंट हैंडलर के अंदर ईवेंट हैंडलर को परिभाषित कर रहे हैं, तो आपके पास बुरा समय आने वाला है। मैं दृढ़ता से आपको सुझाव देता हूं कि आप ऐसा न करें, यहां थोड़ा कम हैकी विकल्प है जो एक समान चीज प्राप्त करता है: gist.github.com/cmawhorter/a1b0b6a6b73678b97920f748ebb244b

— Cory Mawhorter

Answer 3

यदि आप मैप्स एपीआई v3 का उपयोग कर रहे हैं, तो यह बदल गया है।

संस्करण 3 में, आप अनिवार्य रूप से bounds_changedघटना के लिए एक श्रोता स्थापित करना चाहते हैं , जो मानचित्र लोड पर ट्रिगर होगा। एक बार जो ट्रिगर हो गया है, श्रोता को हटा दें क्योंकि आप हर बार व्यूपोर्ट की सीमा में बदलाव के बारे में सूचित नहीं करना चाहते हैं।

भविष्य में यह बदल सकता है क्योंकि V3 एपीआई का विकास हो रहा है :-)

Comments

मैं इस tilesloadedघटना को खोजने के लिए मज़बूती से मेरे लिए काम नहीं कर रहा हूँ ।

— TMC

Answer 4

2018 में:

var map = new google.maps.Map(...)
map.addListener('tilesloaded', function () { ... })

https://developers.google.com/maps/documentation/javascript/events

Comments

tilesloaded एकमात्र समाधान सही ढंग से इंतजार कर रहा है कि जब तक KML परतों सभी प्रदान की गई है

— smirkingman

Answer 5

यदि आप वेब घटकों का उपयोग कर रहे हैं , तो उनके पास यह एक उदाहरण है:

map.addEventListener('google-map-ready', function(e) {
   alert('Map loaded!');
});

Comments

भयानक टिप्पणी, इतने सारे स्तरों पर इसका गलत पता नहीं कहाँ से शुरू करें।

— रात

आप "भयानक टिप्पणी क्यों कहते हैं, यह बहुत सारे स्तरों पर गलत है, मुझे नहीं पता कि कहां से शुरू करें"?

— फिलिप सेन

लेकिन सिर्फ गूगल मैप्स की तुलना में एक अलग फ्रेमवर्क का उपयोग करके एक समाधान क्यों प्रदान करें?

— रात

क्योंकि यह शायद बेहतर है?

— फिलिप सन्ह

HAHAHAHA @nights

— जुआन

Answer 6

GMap2::tilesloaded() वह घटना होगी जिसकी आप तलाश कर रहे हैं।

संदर्भों के लिए GMap2.tilesloaded देखें ।

Comments

मैंने टाइललोड () घटना के बारे में बहुत कुछ पढ़ा है और ऐसा लगता है कि यह आग लगने पर बेहद असंगत है। कोई अन्य विकल्प?

Answer 7

जहाँ चर mapप्रकार GMap2 की एक वस्तु है:

    GEvent.addListener(map, "tilesloaded", function() {
      console.log("Map is fully loaded");
    });

Answer 8

मेरे मामले में, छवि tilesloadedको रेंडर करने से पहले रिमोट यूआरएल और ईवेंट से लोड टाइल इमेज को ट्रिगर किया गया था।

मैंने गंदे तरीके से हल किया।

var tileCount = 0;
var options = {
    getTileUrl: function(coord, zoom) {
        tileCount++;
        return "http://posnic.com/tiles/?param"+coord;
    },
    tileSize: new google.maps.Size(256, 256),
    opacity: 0.5,
    isPng: true
};
var MT = new google.maps.ImageMapType(options);
map.overlayMapTypes.setAt(0, MT);
google.maps.event.addListenerOnce(map, 'tilesloaded', function(){
    var checkExist = setInterval(function() {
        if ($('#map_canvas > div > div > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) > div > div').length === tileCount) {
            callyourmethod();
            clearInterval(checkExist);
        }
    }, 100); // check every 100ms
});

Answer 9

आप यह देखने के लिए GMap2.isLoaded()विधि की जांच कर सकते nहैं कि क्या यह नक्शा और इसकी सभी टाइलें भरी हुई थीं ( window.setTimeout()या window.setInterval()आपके मित्र हैं)।

हालांकि यह आपको लोड पूरा होने की सटीक घटना नहीं देगा, यह आपके जावास्क्रिप्ट को ट्रिगर करने के लिए पर्याप्त होना चाहिए।