StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I think I've found the answer and it appears to be to do with <a href="https://stackoverflow.com/questions/4112893/google-maps-geocoding-and-markers-in-loop">closures</a>. I'm not entirely sure how it fixed it, but I moved the geocoding functions into a nested function and then I call it within the while loop. Since it doesn't execute until the end, once it does, I need to loop through the arrays again and add them to a map. The code works successfully, but I don't really understand why, unfortunately. </p> <p>I'd love if someone could chime in on why this works and perhaps a better way to set it up, but for the meantime this is fixed with:</p> <pre><code>function initialize() { function geocode() { var address = addressGlobal[j]; var k = 0; myLatLng = geocoder.geocode({ 'address': address }, function (results, status) { if (status == google.maps.GeocoderStatus.OK) { while (k != posts) { var lat = results[0].geometry.location.lat(); var lng = results[0].geometry.location.lng(); var myLatLng = new google.maps.LatLng(lat,lng); alert(lat + lng); place[k] = new google.maps.Marker({ position: myLatLng, map: map, icon: image, url: postURL[k], title: postTitle[k] }); google.maps.event.addListener(place[k], 'click', function() { map.panTo(this.getPosition()); map.setZoom(7); $("#fountainG").fadeIn(250); history.pushState(null, this.title, this.url); //offsetCenter(myLatLng,-400,0,map); $(".dynamic").load(this.url + " .dynamic", function(response, status, xhr) { $('.dynamic').fadeIn(500); $('.dim').fadeIn(500); $("#fountainG").fadeOut(250); }); }); k++; } } else { alert('Geocode was not successful for the following reason: ' + status); } }); } var geocoder = new google.maps.Geocoder(); google.maps.visualRefresh = true; var mapOptions = { zoom: 5, center: new google.maps.LatLng(37.09024,-95.712891), disableDefaultUI: true, }; var posts = locationLat.length; var j = 0; map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); var place = []; while (posts != j) { var image = server + '/location_marker.png'; //var myLatLng = new google.maps.LatLng(locationLat[j],locationLong[j]); geocode(); alert(myLatLng); j++; } //Determine if the user came in via the front page or a post so we can set the viewport correctly if ( entryPage == "post" ) { map.setZoom(7); var postView = new google.maps.LatLng(postLocationLat, postLocationLong); map.panTo(postView); } } </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload