We Keep Coding

Google Maps : function returns undefined value works fine in console.log

I am trying to return lat , lon for address it prints array on console.log but does not work in function return
var markers = new Array();
var cityCircles = new Array();
var polycordinates = new Array();
var previousepolygones = new Array();
var infoxboxs = new Array();
function initialize() {
var mapProp = {
center:new google.maps.LatLng(44.03121020078675, 23.41763112193103),
zoom: <?= (isset($zoom) and $zoom != '') ? $zoom : '7' ?>,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
console.log(getcountrylatlng("Romania"));
}
function getcountrylatlng(countryname){
var geocoder = new google.maps.Geocoder();
geocoder.geocode(
{'address': countryname},
function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[0]) {
//var result = results[0].formatted_address;
//var city = result.split(" - ");
//console.log(results[0]);
return results[0];
}
}
}
);
}
on console.log it returns an object but if i return value as in above function it returns undefined
Need help with this ,

You return from the wrong position the retrun of console log is inside a inner function so is not returned to the caller function .
function getcountrylatlng(countryname){
var geocoder = new google.maps.Geocoder();
var myValue;
geocoder.geocode(
{'address': countryname},
function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[0]) {
//var result = results[0].formatted_address;
//var city = result.split(" - ");
//console.log(results[0]);
//return results[0];
myValue = results[0];
}
}
}
);
return myValue;
}

Helper function of a controller does not return anything

I have a function in my map controller to convert an address to a google.maps.latlng and I want to return this value, but my function doesn't return anything. I think thats because the values change inside another function, but I can't figure out how to solve this.
addressToLatLng: function(address) {
var geocoder = new google.maps.Geocoder(), lat, lng, latlng;
geocoder.geocode({ 'address': address }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
lat = results[0].geometry.location.lat();
lng = results[0].geometry.location.lng();
latlng = new google.maps.LatLng(lat, lng);
console.log(latlng); // will give me the object in the log
}
});
return latlng; // nothing happens
},

That's because the geocode call is asynchronous, so you are trying to return the value before it exists.
You can use a callback for the caller to get the value when it arrives:
addressToLatLng: function(address, callback) {
var geocoder = new google.maps.Geocoder(), lat, lng, latlng;
geocoder.geocode({ 'address': address }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
lat = results[0].geometry.location.lat();
lng = results[0].geometry.location.lng();
latlng = new google.maps.LatLng(lat, lng);
callback(latlng);
}
});
},
Usage:
yourController.addressToLatLng(address, function(latlng){
console.log(latlng);
});

for each only running once

First let me explain. I have several addresses on the page that I put into an array. I then want to go over that array and replace each address with its longitude and latitude.
The problem is my attempt only runs one time.
$(function () {
var addr = 0;
var shops = [];
var addressPoint;
var latlng = new google.maps.LatLng(38, -97);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
window.onload = function () {
var options = [];
$('.address').each(function () {
if (!$(this).is(":empty")) {
options.push($(this).text());
txt = $(this).text();
} else {}
});
alert(options);
$.each(options, function () {
var addr = ("'" + this + "'");
searchAddr(addr);
});
function searchAddr(addr) {
$('#map_canvas').gmap({
'callback': function () {
var self = this;
alert(addr);
self.search({
'address': addr
}, function (results, status) {
if (status === 'OK') {
addressPoint = results[0].geometry.location;
alert(addressPoint);
options = $.map(options, function () {
return results[0].geometry.location;
});
self.get('map').panTo(results[0].geometry.location);
alert(options);
return false;
}
});
}
});
}
};
}(jQuery));

Did you use a network sniffer to confirm it is only firing once? Because it looks like you are replacing each value in the list with a single value in the $.map command. Perhaps if you put the address points in a different array it would help:
$(function () {
var addr = 0;
var shops = [];
var addressPoint;
var latlng = new google.maps.LatLng(38, -97);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var points = [];
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
window.onload = function () {
var options = [];
$('.address').each(function () {
if (!$(this).is(":empty")) {
options.push($(this).text());
txt = $(this).text();
} else {}
});
alert(options);
$.each(options, function () {
var addr = ("'" + this + "'");
searchAddr(addr);
});
function searchAddr(addr) {
$('#map_canvas').gmap({
'callback': function () {
var self = this;
alert(addr);
self.search({
'address': addr
}, function (results, status) {
if (status === 'OK') {
addressPoint = results[0].geometry.location;
alert(addressPoint);
points.push(addressPoint);
});
self.get('map').panTo(addressPoint);
alert(points);
return false;
}
});
}
});
}
};
}(jQuery));

How can I timeout a google maps geocoder via javascript?

I am very new to javascript and I am having issues with timing out the geocoder requests.
But I am stuck, I tries to add delays into loop, but seems like they don't work.
If you can help, I would appreciarte it.
<script type="text/javascript">
function setLocationOnMap(locs) {
var myOptions = {
zoom: 4,
center: new google.maps.LatLng(locs.lat(), locs.lng()),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);
var i=0;
var total='<?php echo $counter ?>';
for (i=0; i<total;i++){//adding cities to map by
var city= document.the_form.elements[i].value;
getLatLong2(city, map, setPointer);
}
}
function setPointer(map, address, locs2){
var position = new google.maps.LatLng(locs2.lat(), locs2.lng());
var marker = new google.maps.Marker({
position: position,
map: map
});
marker.setTitle(address);
}
function initialize() {
var address = "Chicago IL";
getLatLong(address, setLocationOnMap);
}
function getLatLong2(address, map, callback){
var geo = new google.maps.Geocoder;
geo.geocode({'address':address},function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
locs2 = results[0].geometry.location;
callback(map, address, locs2);
} else {
//alert("Geocode was not successful for the following reason: " + status);
}
});
}
function getLatLong(address, callback){
var geo = new google.maps.Geocoder;
geo.geocode({'address':address},function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
// processing...
locs = results[0].geometry.location;
//pausecomp(10000);
callback(locs);
} else {
//alert("Geocode was not successful for the following reason: " + status);
}
});
}
</script>

When you submit the geocode request, you can start a timer in parallel and when the timer fires, you can declare the request to have timed out. The request will still continue, but you can ignore the results once it has timed out:
function getLatLong(address, callback){
var timerId;
var timedOut = false;
var geo = new google.maps.Geocoder;
geo.geocode({'address':address},function(results, status){
if (timedOut) {
// this request timed out, so ignore results
return;
} else {
// this request succeeded, so cancel timer
clearTimeout(timerId);
}
if (status == google.maps.GeocoderStatus.OK) {
locs = results[0].geometry.location;
callback(locs);
} else {
//alert("Geocode was not successful for the following reason: " + status);
}
});
timerId = setTimeout(function() {
timedOut = true;
alert('Request timed out.');
// do something else
}, 10000);
}

javascript function is returning undefined

I'm trying to implement google maps and the problem I am having is that when I call the function getLatLng, it is returning an undefined value and I can't figure out why.
initialize();
var map;
var geocoder;
function initialize() {
geocoder = new google.maps.Geocoder();
var address = "Rochester, MN";
var myLatLng = getLatLng(address);
console.log("myLatLng = "+myLatLng);
}
function getLatLng(address) {
var codedAddress;
geocoder.geocode({'address': address}, function(results, status) {
if(status == google.maps.GeocoderStatus.OK) {
codedAddress = results[0].geometry.location;
console.log("codedAddress 1 = "+codedAddress);
} else {
alert("There was a problem with the map");
}
console.log("codedAddress 2 = "+codedAddress);
});
console.log("codedAddress 3 = "+codedAddress);
return codedAddress;
}
In the firebug console, here is the output that I get in this exact order:
codedAddress 3 = undefined
myLatLng = undefined
codedAddress 1 = (44.0216306, -92.46989919999999)
codedAddress 2 = (44.0216306, -92.46989919999999)
Why is codedAddress 3 and myLatLng showing up first in the console?

geocode is asynchronous (i.e. it sends a request to Google's servers), so you need to pass a callback function to getLatLng, rather than having it return immediately:
function getLatLng(address, callback) {
var codedAddress;
geocoder.geocode({'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
codedAddress = results[0].geometry.location;
console.log("codedAddress 1 = "+codedAddress);
} else {
alert("There was a problem with the map");
}
console.log("codedAddress 2 = "+codedAddress);
callback(codedAddress);
});
}

Here's what I got to work via the Google Maps documentation:
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var address = "Rochester, MN";
var latlng = codeAddress(address);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function codeAddress(address) {
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
Here's a jsFiddle to see it in action. Obviously, you can update this to use jQuery if you need to.

You're missing a closing } for the initialize function.