My friend and I are collaborating to develop a Google Map marker for each entry in a table. Although I have implemented a loop, I am uncertain if it is correct. The map functions properly, allowing me to insert normal markers and cycle through the entries to append them to a div. However, when attempting to incorporate the marker code within the loop, I encounter numerous errors in the console:
InvalidValueError: setPosition: not a LatLng or LatLngLiteral: in property lat: not a number
InvalidValueError: setMap: not an instance of Map; and not an instance of StreetViewPanorama
Could this indicate that the database has failed to store the latitude/longitude as numbers? Below is a simplified version of the code that I currently have:
$.ajax({
type: 'POST',
url: 'getAllJson.php',
success: function(jsonData) {
var obj = (jsonData);
$.each(obj, function(key,value) {
//console.log(key, first, value[1], value[2]);
var user = {
id: value["id"],
firstName: value["first_name"],
lastName: value["last_name"],
email: value["email"],
lat: value["latitude"],
long: value["longitude"]
};
var firstName = user.firstName,
lastName = user.lastName,
email = user.email,
userLat = user.lat,
userLong = user.long;
// marker
var markerLatLng = {lat: userLat, lng: userLong};
var marker = new google.maps.Marker({
position: markerLatLng,
map: map
});
});
}
});
Am I heading in the right direction, or is there a more efficient method to iterate through all entries and generate markers based on their latitude/longitude coordinates? Your feedback would be greatly appreciated!