javascript - fitBounds(bound) function not working properly -


i have te following code:

var bound = new google.maps.latlngbounds();     if (arrmarkers.length > 0) {                                                     (var = 0; < arrmarkers.length; i++) {                                 bound.extend(new google.maps.latlng(arrmarkers[i].getposition().lat(), arrmarkers[i].getposition().lng()));                             }                             strdefaultltlong = bound.getcenter();// center bounds                          }     var image = 'images/star.png';                          var mapoptions = {                             center: strdefaultltlong,                             maptypeid: google.maps.maptypeid.roadmap,                             disabledoubleclickzoom: true,                             zoom: parseint(strdefaultzoomlevel)                          }                          map = new google.maps.map(document.getelementbyid('map-canvas'), mapoptions);                         if (arrmarkers.length == 1) {                             map.setzoom(parseint(strdefaultzoomlevel));                         }                         else if (arrmarkers.length > 1) {                             map.fitbounds(bound);                              google.maps.event.addlistener(map, 'idle', function (event) {                                 if (map.getzoom() > parseint(strdefaultzoomlevel)) {                                     map.setzoom(parseint(strdefaultzoomlevel));                                 }                             });                             google.maps.event.clearlisteners(map, 'idle');                          } 

i have list of locations in arrmarkers. fitbounds() function works if locations have different location if list of locations has same location(lat&long) displays zoomed map.

how can handle default zoom or particular zoom level listing display appropriatly?

thanks..

if locations of markers equal, may compare sw , ne of bounds, should equal too:

//if (arrmarkers.length == 1) { if(bounds.getsouthwest().tourlvalue()       ===    bounds.getnortheast().tourlvalue()){    map.setzoom(parseint(strdefaultzoomlevel));  } 

demo:

function init() {                    var goo=google.maps,              strdefaultzoomlevel='7',                    map = new goo.map(document.getelementbyid('map_canvas'),              {                zoom: parseint(strdefaultzoomlevel),                noclear:true              }),          btn=document.getelementbyid('btn'),          markers=[                            new goo.marker({position:{lat:11.11,lng:22.22},                                            icon:{                                                     url:'http://maps.google.com/mapfiles/dir_0.png',                                                    scaledsize:new goo.size(48,48)                                                 }}),                            new goo.marker({position:{lat:11.11,lng:22.22},                                            icon:{                                                     url:'http://maps.google.com/mapfiles/dir_60.png',                                                    scaledsize:new goo.size(48,48)                                                 }}),                            new goo.marker({position:{lat:66.66,lng:77.77},                                            icon:{                                                     url:'http://maps.google.com/mapfiles/dir_0.png',                                                    scaledsize:new goo.size(48,48)                                                 }})                         ];                    map.controls[goo.controlposition.bottom_center]            .push(btn);                    goo.event.adddomlistener(btn,'click',function(){                        for(var i=0;i<markers.length;++i){              markers[i].setmap(null);            }            this.value=(this.value==='draw equal markers')                        ? 'draw different markers'                        : 'draw equal markers';                                    var arrmarkers=markers.slice.apply(markers,(this.value==='draw equal markers')                                                          ? [1,3]                                                          : [0,2]),                bounds=new goo.latlngbounds();                        for(var i=0;i<arrmarkers.length;++i){              arrmarkers[i].setmap(map);              bounds.extend(arrmarkers[i].getposition());            }                        if(bounds.getsouthwest().tourlvalue()                ===               bounds.getnortheast().tourlvalue()){                map.setoptions({                              zoom:parseint(strdefaultzoomlevel),                              center:bounds.getcenter()                             });             }            else{              map.fitbounds(bounds);            }                     });          google.maps.event.trigger(btn,'click');                          }
html,body,#map_canvas{height:100%;margin:0;padding:0;}         #btn{font:14px bold monospace;background:tomato;margin-bottom:12px;}
<div id="map_canvas">    <input id="btn" type="button" value="draw equal markers"/>  </div>  <script src="https://maps.googleapis.com/maps/api/js?v=3&callback=init"></script>


Comments