গুগল ম্যাপস এপিআই ভি 3 - গেটবাউন্ডগুলি পূর্বনির্ধারিত

Question 1

আমি v2 থেকে v3 গুগল ম্যাপস এপিআই এ স্যুইচ করছি এবং gMap.getBounds()ফাংশনে সমস্যা আছে got

আমার মানচিত্রের শুরু করার পরে আমার সীমানা পাওয়া দরকার।

আমার জাভাস্ক্রিপ্ট কোডটি এখানে:


var gMap;
$(document).ready(

    function() {

        var latlng = new google.maps.LatLng(55.755327, 37.622166);
        var myOptions = {
            zoom: 12,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        gMap = new google.maps.Map(document.getElementById("GoogleMapControl"), myOptions);

        alert(gMap.getBounds());
    }
);

সুতরাং এখন এটি আমাকে সতর্ক করে gMap.getBounds()যা অপরিজ্ঞাত।

আমি ক্লিক ইভেন্টে getBounds মান পেতে চেষ্টা করেছি এবং এটি আমার জন্য ভাল কাজ করে, কিন্তু লোড মানচিত্র ইভেন্টে আমি একই ফলাফল পেতে পারি না।

গুগল ম্যাপস এপিআই ভি 2 তে দস্তাবেজটি লোড হওয়ার সময় গেটবাউন্ডসও ঠিকঠাক কাজ করে তবে এটি ভি 3 এ ব্যর্থ হয়।

আপনি কি আমাকে এই সমস্যাটি সমাধান করতে সহায়তা করতে পারেন?

Question 2

ভি 3 এপিআই এর প্রথম দিনগুলিতে, getBounds()পদ্ধতিটিতে মানচিত্রের টাইলগুলির সঠিক ফলাফলগুলি ফেরত দেওয়ার জন্য লোড করা শেষ হওয়া দরকার। তবে এখন মনে হচ্ছে আপনি bounds_changedইভেন্টটি শুনতে পারবেন যা tilesloadedইভেন্টের আগেই বহিস্কার করা হয়েছে :

<!DOCTYPE html>
<html> 
<head> 
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
   <title>Google Maps v3 - getBounds is undefined</title> 
   <script src="http://maps.google.com/maps/api/js?sensor=false" 
           type="text/javascript"></script> 
</head> 
<body> 
   <div id="map" style="width: 500px; height: 350px;"></div> 

   <script type="text/javascript"> 
      var map = new google.maps.Map(document.getElementById("map"), {
         zoom: 12,
         center: new google.maps.LatLng(55.755327, 37.622166),
         mapTypeId: google.maps.MapTypeId.ROADMAP
      });

      google.maps.event.addListener(map, 'bounds_changed', function() {
         alert(map.getBounds());
      });
   </script> 
</body> 
</html>

Question 3

এটি getBounds () এর ডকুমেন্টেশন অনুযায়ী কমপক্ষে কাজ করা উচিত। তবুও:

var gMap;
$(document).ready(function() {
    var latlng = new google.maps.LatLng(55.755327, 37.622166);
    var myOptions = {
        zoom: 12,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    gMap = new google.maps.Map(document.getElementById("GoogleMapControl"), myOptions);
    google.maps.event.addListenerOnce(gMap, 'idle', function(){
        alert(this.getBounds());
    });
});

এটি এখানে কাজ দেখুন ।

Question 4

আমি বলছিলাম সালমানের সমাধান আরও ভাল কারণ idleইভেন্টটি আগেরটির আগে বলা হয়েছিল tilesloaded, যেহেতু এটি সমস্ত টাইল লোড হওয়ার জন্য অপেক্ষা করে। তবে আরও ঘনিষ্ঠ নজরে দেখে মনে bounds_changedহচ্ছে এটি আরও আগে বলা হয়েছিল এবং এটি আরও সার্থক করে তোলে, যেহেতু আপনি সীমাটি সন্ধান করছেন, তাই না? :)

সুতরাং আমার সমাধানটি হবে:

google.maps.event.addListenerOnce(gMap, 'bounds_changed', function(){
    alert(this.getBounds());
});

Question 5

এখানে অন্যান্য মন্তব্যে, এটি "নিষ্ক্রিয়" এর উপরে "সীমানা_চেনা" ইভেন্টটি ব্যবহার করার পরামর্শ দেওয়া হয়েছে, যার সাথে আমি সম্মত। অবশ্যই আই 8 এর অধীনে যা কমপক্ষে আমার ডেভ মেশিনে "সীমানা পরিবর্তন" করার আগে "নিষ্কলুষ" ট্রিগার করে, আমাকে গেটবাউন্ডে নালার রেফারেন্স দিয়ে রেখে দেয়।

আপনি যখন মানচিত্রটি টানবেন তখনই "সীমানা_দিকিত" ইভেন্টটি ধারাবাহিকভাবে ট্রিগার করা হবে। এর জন্য, আপনি যদি মার্কার লোড করা শুরু করতে এই ইভেন্টটি ব্যবহার করতে চান তবে এটি আপনার ওয়েবসভারে ভারী হবে।

এই সমস্যার জন্য আমার বহু ব্রাউজার সমাধান:

google.maps.event.addListenerOnce(gmap, "bounds_changed", function(){
   loadMyMarkers();
   google.maps.event.addListener(gmap, "idle", loadMyMarkers);
});

Question 6

ভাল, আমি খুব দেরি করেছি কিনা তা নিশ্চিত নই, তবে gmaps.js প্লাগইন ব্যবহার করে আমার সমাধানটি এখানে দেওয়া হয়েছে :

map = new GMaps({...});

// bounds loaded? if not try again after 0.5 sec
var check_bounds = function(){

        var ok = true;

        if (map.getBounds() === undefined)
            ok = false;

        if (! ok) 
            setTimeout(check_bounds, 500);
        else {
             //ok to query bounds here
              var bounds = map.getBounds();
        }   
    }

    //call it
    check_bounds();