ค้นหาเว็บไซต์

javascript - ฉันจะตรวจสอบได้อย่างไรว่ากูเกิลแมปโหลดเสร็จสมบูรณ์แล้ว?


ฉันกำลังฝัง Google Maps ลงในเว็บไซต์ของฉัน เมื่อ Google Maps โหลดเสร็จ ฉันจำเป็นต้องเริ่มกระบวนการ JavaScript บางอย่าง

มีวิธีใดที่จะตรวจสอบโดยอัตโนมัติเมื่อ Google Maps โหลดเสร็จสมบูรณ์ รวมถึงการดาวน์โหลดไทล์ทั้งหมดหรือไม่?

มีวิธี tilesloaded() อยู่ซึ่งควรจะทำงานนี้ได้อย่างแน่นอน แต่กลับใช้งานไม่ได้

คำตอบ #1

สิ่งนี้รบกวนฉันอยู่สักพักกับ GMaps v3

ฉันพบวิธีทำมันแบบนี้:

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

เหตุการณ์ "idle" จะถูกเรียกใช้งานเมื่อแผนที่เข้าสู่สถานะว่าง - ทุกอย่างถูกโหลดแล้ว (หรือโหลดไม่สำเร็จ) ผมพบว่ามันน่าเชื่อถือมากกว่าการใช้ tilesloaded/bounds_changed และเมื่อใช้วิธี addListenerOnce โค้ดในคลอเจอร์จะถูกดำเนินการครั้งแรกเมื่อเกิดเหตุการณ์ "idle" และจากนั้นเหตุการณ์จะถูกยกเลิกการเชื่อมต่อ

ดูส่วนเหตุการณ์ในเอกสารอ้างอิงของ Google Maps ด้วย

คำตอบ #2

ฉันกำลังสร้างแอปมือถือ html5 และฉันสังเกตว่าอีเวนต์ 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
    });
});

คำตอบ #3

ในปี 2018:

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

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

คำตอบ #4

ถ้าคุณกำลังใช้ Maps API v3 สิ่งนี้ได้เปลี่ยนไปแล้ว

ในเวอร์ชัน 3 คุณต้องการตั้งค่าตัวฟังสำหรับเหตุการณ์ bounds_changed ซึ่งจะทำงานเมื่อโหลดแผนที่ เมื่อเหตุการณ์นั้นทำงานแล้ว ให้ลบตัวฟังออกเพราะคุณไม่ต้องการถูกแจ้งทุกครั้งที่ขอบเขตมุมมองเปลี่ยนไป

สิ่งนี้อาจเปลี่ยนแปลงในอนาคตเนื่องจาก API เวอร์ชัน 3 กำลังพัฒนา :-)

บทความที่เกี่ยวข้อง