I'm currently utilizing the Google Maps API to generate specific zones on a map. I have stored the geodata in a database and am retrieving it through Ajax.
The issue lies in the fact that the API requires the data in an object format, like so:
var myHome = { "lat" : "44.767778" , "long" : "-93.2775" };
Therefore, I need to structure the array with {"lat" : and "long : ... };
Could someone please advise me on how to achieve this?
With the assistance provided, here is what I implemented. Although no errors appear, nothing is displayed on the map. I modeled it after the BermudaTriangle example from the API: https://developers.google.com/maps/documentation/javascript/examples/polygon-autoclose
$.get(
"getZones.php", //Retrieve geodata from the database
function(data) {
locZone = data;
var reg=new RegExp("[/]+", "g"); //Segment points of the zone
var tableau=locZone.split(reg);
for (var i=0; i<tableau.length; i++) {
points = new google.maps.LatLng(tableau[i]);
coords.push(points); //Store the coordinates in an array
}
var zone = new google.maps.Polygon({
paths: coords, //Utilize the array similar to the API example
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 3,
fillColor: '#FF0000',
fillOpacity: 0.35
});
zone.setMap(map);
}
);
Everything seems fine, I just modified the loop as follows:
for (var i=0; i<tableau.length; i++) {
var b=tableau[i].split(","); //Split lat & lng
points=new google.maps.LatLng(parseFloat(b[0]), parseFloat(b[1])); //Convert data to float type
coords.push(points);
}