Google Places Api: Not able to display all search results - google-maps-api-3

Question

I am unable to display all the results requested from the Google Places Api..
var Latlng = new google.maps.LatLng(Latitute, Longitute);
map = new google.maps.Map(document.getElementById('map_canvas'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: Latlng,
zoom: 10});
var request = {location: Latlng,types: [type]};
var service = new google.maps.places.PlacesService(map);
service.search(request, callback);
}
function callback(results,status,pagination) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
createMarker(results[i]);
}
if (pagination.hasNextPage) {
pagination.nextPage(); }}}
function createMarker(place) {
var placeLoc = place.geometry.location;
var marker = new google.maps.Marker({map: map,zIndex: 100,position: place.geometry.location});
var request = {reference : place.reference,};
service = new google.maps.places.PlacesService(map);
service.getDetails(request, function detailsDisplay(details, status){
if (status === google.maps.places.PlacesServiceStatus.OK) {
console.log(status);
$('#placesdata').append('<tr><td><a href='+details.url+'>' + details.name+ '</a></td></tr>');
} else if (status === google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
setTimeout(function() {
createMarker(place);
}, 200);}});} };
i used pagination and getting 60 results but only can display 20..and 40 using settimeout() function...getting the following error: Uncaught TypeError: Cannot read property 'length' of null. Any clue?

Answer 1

Most likely you are getting OVER_QUERY_LIMIT on line:
if (status == google.maps.places.PlacesServiceStatus.OK)
because you are already creating Markers, which eats up your quota.
Try queuing the details requests for after you have all the list completed, and adding the same timeout logic to check for google.maps.places.PlacesServiceStatus.OVER_QUERY_LIMIT on this line.
For example you could say:
if (pagination.hasNextPage) {
//add all places to the list
setTimeout('pagination.nextPage()',2000);
} else {
createMarkers(placesList);
}
btw. the Places equivalent of google.maps.GeocoderStatus.OVER_QUERY_LIMIT is google.maps.places.PlacesServiceStatus.OVER_QUERY_LIMIT and you should use this when using Places.
HTH

Answer 2

I have done all those effort. Thanks for you guys for posting but i got solution. really a good solution. See working example below.
When you call this method to check if it has pages or not
if(pagination.hasNextPage){
pagination.nextPage(); // let this do recursive loop against request.
}
// when nextPage() request finishes
if(pagination.b == null){
// here pagination.b has next page token. so it return null when last request sent.
createMarkers(placesList);
}