I'm trying to take an address in a for loop and get the latitude and longitude of that address and create a marker with the lat/long values.
I have the address converting to lat/long but I cannot get the "new Marker" to take the values.
Any suggestions?
var latitude;
var longitude;
var myLatLng;
for (i = 0; i < locations.length; i++) {
var geocoder = new google.maps.Geocoder();
var BuisAddress = locations[i][1];
geocoder.geocode({ 'address': BuisAddress }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
latitude = results[0].geometry.location.lat();
longitude = results[0].geometry.location.lng();
}
});
myLatLng = new google.maps.LatLng(latitude, longitude);
marker = new google.maps.Marker({
position: myLatLng,
map: map
});
**** 1st UPDATE ****
if I do that, then only one marker shows up when I have multiple addresses and the marker popup doesn't work. If I do the following, then all three markers show up, but still none of clickable popup's work.
var geocoder = new google.maps.Geocoder();
BuisAddress = locations[i][1];
geocoder.geocode({ 'address': BuisAddress }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
latitude = results[0].geometry.location.lat();
longitude = results[0].geometry.location.lng();
myLatLng = new google.maps.LatLng(latitude, longitude);
marker = new google.maps.Marker({
position: myLatLng,
map: map
});
}
});
myLatLng = new google.maps.LatLng(latitude,longitude);
marker = new google.maps.Marker({
position: myLatLng,
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
var str = encodeURI(locations[i][1]).replace(",", "");
var address = str.replace(/%20/g, "+");
var infowindow = new google.maps.InfoWindow();
If anyone is wondering how I did it, here it is!
function geocodeAddress(locations, i) {
var title = locations[i][0];
var address = locations[i][1];
var url = locations[i][2];
var latitude;
var longitude;
geocoder.geocode({
'address': locations[i][1]
},
function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
latitude = results[0].geometry.location.lat();
longitude = results[0].geometry.location.lng();
var marker = new google.maps.Marker({
icon: 'http://maps.google.com/mapfiles/ms/icons/blue.png',
map: map,
position: results[0].geometry.location,
title: title,
animation: google.maps.Animation.DROP,
address: address,
url: url,
latitude: latitude,
longitude: longitude
})
infoWindow(marker, map, title, address, url, latitude, longitude);
bounds.extend(marker.getPosition());
map.fitBounds(bounds);
} else {
alert("geocode of " + address + " failed:" + status);
}
});
}
function infoWindow(marker, map, title, address, url, latitude, longitude) {
google.maps.event.addListener(marker, 'click', function() {
var html ="html code here...";
iw = new google.maps.InfoWindow({
content: html,
maxWidth: 350
});
iw.open(map, marker);
});
}
function createMarker(results) {
var marker = new google.maps.Marker({
icon: 'http://maps.google.com/mapfiles/ms/icons/blue.png',
map: map,
position: results[0].geometry.location,
title: title,
animation: google.maps.Animation.DROP,
address: address,
url: url
})
bounds.extend(marker.getPosition());
map.fitBounds(bounds);
infoWindow(marker, map, title, address, url);
return marker;
}