I want to finish first all results before going to another loops. How can I manage to achieve that?

function callback_Original(results, status) { 
    if (status === google.maps.places.PlacesServiceStatus.OK) { 
      for (var i = 0; i < results.length; i++) { 
                createMarker_Original(results[i]);
      }
    }
  }

It always gives few places sometimes.

function createMarker_Original(place) {
    var photos = place.photos;
    if (!photos) {
        return;
    }

    var placeLoc = place.geometry.location;
    var marker = new google.maps.Marker({
      map: map,
      position: place.geometry.location
    });



    google.maps.event.addListener(marker, 'click', function() { 
          infowindow.setContent('<div style="float:left"><img src="' + photos[0].getUrl({'maxWidth': 120, 'maxHeight': 120}) 
          + '"></div><div style="float:right; padding: 10px;"><b>Name: </b>'+  place.name +'<br/>'+
          '<b>Coordinates : </b>'+ place.geometry.location +'<br/>'+
          '<b>Type: </b>'+ type +'<br/>');
          infowindow.open(map, this);
    });
}

I want to finish first all results before going to another loops. How can I manage to achieve that?

function callback_Original(results, status) { 
    if (status === google.maps.places.PlacesServiceStatus.OK) { 
      for (var i = 0; i < results.length; i++) { 
                createMarker_Original(results[i]);
      }
    }
  }

It always gives few places sometimes.

function createMarker_Original(place) {
    var photos = place.photos;
    if (!photos) {
        return;
    }

    var placeLoc = place.geometry.location;
    var marker = new google.maps.Marker({
      map: map,
      position: place.geometry.location
    });



    google.maps.event.addListener(marker, 'click', function() { 
          infowindow.setContent('<div style="float:left"><img src="' + photos[0].getUrl({'maxWidth': 120, 'maxHeight': 120}) 
          + '"></div><div style="float:right; padding: 10px;"><b>Name: </b>'+  place.name +'<br/>'+
          '<b>Coordinates : </b>'+ place.geometry.location +'<br/>'+
          '<b>Type: </b>'+ type +'<br/>');
          infowindow.open(map, this);
    });
}

• javascript
• google-maps

Share Follow edited Mar 17, 2018 at 8:30 Roamer-1888 19.3k55 gold badges3535 silver badges4545 bronze badges asked Mar 17, 2018 at 7:44 MaeLstroms StromsMaeLstroms Stroms 4911 gold badge11 silver badge66 bronze badges 6

• 1 What does createMarker_Original do? – Dai Commented Mar 17, 2018 at 7:59
• 1 Also, JavaScript in the browser is (for the most part) asynchronous - it does not block or wait - so if you're making an external HTTP request then, no, you cannot block or wait for it to finish - you have to structure your program around the concept of asynchronous-programming. It's the future: Node.js is entirely async, C# has await and C++ is getting something similar. – Dai Commented Mar 17, 2018 at 8:00
• Is there a way to do that? @Dai – MaeLstroms Stroms Commented Mar 17, 2018 at 8:02
• 1 Yes, but we need to see the rest of your program in context. – Dai Commented Mar 17, 2018 at 8:03
• Update sir @dai – MaeLstroms Stroms Commented Mar 17, 2018 at 8:11

 |  Show 1 more ment

2 Answers 2

Sorted by: Reset to default 6

What about using Promise?(ES6 Code)

function callback_Original(results, status) {
            return new Promise((resolve, reject) => {
                if (status === google.maps.places.PlacesServiceStatus.OK) {
                    for (var i = 0; i < results.length; i++) {
                        createMarker_Original(results[i]);
                    }
                    resolve();
                }else
                    reject("Places service error");
            });
        }

And then just use

callback_Original(a,b)
.then(response => {
// Loop finished, what to do nexT?
})
.catch(error => {
// Error
console.log(error);
});

use async, it'll wait for promise. Reference

function callback_Original_child(results, status) { 
    return new Promise(resolve => {
        if (status === google.maps.places.PlacesServiceStatus.OK) { 
          for (var i = 0; i < results.length; i++) { 
                createMarker_Original(results[i]);
          }
        }
    });
}

async function callback_Original(results, status) { 
    try {
        await callback_Original_child(results, status);
    } catch (error) {
        console.log(error);
    }
}

callback_Original()