Google Maps , Places Api not giving correct results

Question

I am trying to use the geocoding service with the google maps to display markers for nearby places. I am not getting well sorted results, that is they appear to be random and not close to the zipcode provided. I am using a radius of 50000. The code is as given below.

   latlng = new google.maps.LatLng(lat,longitude);
var myOptions = {
  zoom: zoom,
  center: latlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};

map = new google.maps.Map(document.getElementById("map"), myOptions);


//alert("Radius:"+radius_hidden);
var requestsearch = {
    location: latlng,
    radius: radius_hidden,
    name: searchname,
    types: ['store']
};
// keyword: searchname,//name: searchname, to get like pages and name to get exact
service = new google.maps.places.PlacesService(map);
//service.textSearch(requestsearch, callback);
service.search(requestsearch, callback);

if(map != null) {
    google.maps.event.addListener(map, 'drag', function(event) {
        calculateCenter();  
    });
}
          }
       google.maps.event.addDomListener(window, 'load', initialize);


         google.maps.event.addDomListener(window, 'resize', function() {
          map.setCenter(center);
           //google.maps.event.trigger(map, 'resize');
        });
          function calculateCenter() {
        var latlngbounds = new google.maps.LatLngBounds();

        for (var i = 0 ; i < markersArray.length ; i++) {
     latlngbounds.extend(markersArray[i].getPosition());
   }

       //map.setCenter(latlngbounds.getCenter(), map.getBoundsZoomLevel(latlngbounds));
     map.setCenter(latlngbounds.getCenter());
     map.fitBounds(latlngbounds);
        center = map.getCenter();
               }

       function callback(results, status)
         {
var listing='<table width="100%" border="1">';
var num=5;
markersArray = new Array();
if (status == google.maps.places.PlacesServiceStatus.OK) 
{
  for (var i = 0; i < results.length; i++) 
  {
    var pincode='';
    var address='';
    geocoder = new google.maps.Geocoder();
    geocoder.geocode({
      'address': results[i].vicinity,
      'partialmatch': true},function(resultsp, status)
      {
        if (status == 'OK' && resultsp.length > 0) 
        {
            address=resultsp[0].formatted_address;
            var len=resultsp[0].address_components.length-1;
            var res=resultsp[0].address_components[len].short_name;
            if(res!=undefined)
            {
                //address+="<br>Pincode:"+res.toString();
            }
            //listing+='<tr><td>Zip Code: '+res.toString()+'</td></tr>';
        } 
    });

    marker = new google.maps.Marker({
        position: results[i].geometry.location,
        title: results[i].name,
        zIndex: 2,
        icon: gicons["blue"]
    });
            markersArray.push(marker);
    calculateCenter();
    listing+='<tr><td>';

    var address_link=results[i].vicinity.replace(" ","+");
    if(i==0)
    {
        listing+='<table id="div5" width="100%" >'; 
    }
    else if(i%5==0)
    {
        num+=5;
        listing+='<table id="div'+num+'" style="display:none;" width="100%">';  
    }
    //'+results[i].name+'


 listing +='<tr id="searchadd"><td ><input type="hidden" value="'+results[i].name+'" name="end'+i+'" id="end'+i+'"></td></tr><tr><td style="word-wrap: break-word;" onmouseout="markersArray['+i+'].setIcon(gicons.blue)" onmouseover="markersArray['+i+'].setIcon(gicons.yellow)" class="" id="item-'+i+'">'+getaddress(results[i].vicinity)+'<div id="spacer" style="width:120px;height:1px;float:left;"></div><a   style="width:100px;height: 20px;" class="sty-hyperlink" target="_blank" href="https://maps.google.com/maps?daddr='+address_link+'"><b><?php echo getFieldFromDB('user_config','DirectionText'); ?></b></a><br></td></tr>';

        if(i ==(results.length-1))
        {
            listing+='</table>';
            listing+='<span id="largerwindowlink"><br><a  target="_blank" class="sty-action-buttn" href="<?php echo $finalURL; ?>"><?php echo trim(getFieldFromDB('user_config','ActionButtonText')); ?></a></span>';
        }
        else if(i>0 &&(i+1)%5==0)
        {
            listing+='<tr><td align="right"><a class="sty-hyperlink" style="width:100px;height: 20px;" href="javascript:void(0);" onclick="javascript:show_hide_table('+num+');" ><b><?php echo getFieldFromDB('user_config','MoreResultText'); ?></b></a></td></tr></table>';
        }
        listing+='</td></tr>';
      }
      showOverlays(5);
      listing +='</table>';
      if(results.length<=0)
      {
            listing='<br><br><span style="color:green;">Sorry! No stores found.<br>Please try another franchise name</span><br><br>';
      }
    }
    else
    {
        listing='<br><br><span style="color:green;">Sorry! No stores found.<br>Please try another franchise name</span><br><br>';
    }
    document.getElementById("listingAddress").innerHTML=listing;
}
function showOverlays(no) 
{
    if (markersArray) 
    {
        for (i in markersArray) 
        { 
            if(i<no && i>=no-5)
                markersArray[i].setMap(map);
        }
    }
}
function clearOverlays() 
{
    if (markersArray) 
    {
        for (i in markersArray) 
        {
                markersArray[i].setMap(null);
        }
    }
}

I want to have the results in correct order, that is the closer ones first and then the rest.

Answer 1

If you want the places results ordered by distance, you need to tell the API to do that.

https://developers.google.com/maps/documentation/javascript/reference#RankBy

1. Example

2. Example