'jQuery ajax GeoJson coordsToLatLngs data returning - Invalid LatLng object: (undefined, ...)
So I am trying to flip my coordinates so my polygon of country borders on my map aren't stretched vertically across my map.
My border polygons appear but incorrectly. So I implemented Leaflet's coordsToLatLngs function and I'm getting Invalid LatLng object: (undefined, -77.53466,23.75975,-77.78,23.71,-78.03405,24.28615,-78.40848,24.57564,-78.19087,25.2103,-77.89,25.17,-77.54,24.34,-77.53466,23.75975)
Not sure what the undefined could be pointing to?
Thank you guys.
Here is my code
// add borders to countries
$.ajax({
url: "libs/php/mapCountries.php",
type: "POST",
dataType: "json",
success: function (result) {
console.log(result);
for (var i = 0; i < result.data.length; i++) {
var latlng = L.GeoJSON.coordsToLatLngs(result.data[i].geometry.coordinates, 0, false);
var polygon = L.polygon(result.data[i].geometry.coordinates, { color: "red" }).addTo(map);
// zoom the map to the polygon
map.fitBounds(polygon.getBounds());
}
var coords = console.log(result);
},
});
Here is my JSON decoded from my PHP file
{
"data": [
{
"type": "Feature",
"properties": {
"name": "Bahamas",
"iso_a2": "BS",
"iso_a3": "BHS",
"iso_n3": "044"
},
"geometry": {
"type": "MultiPolygon",
"coordinates": [
[
[
[-77.53466, 23.75975],
[-77.78, 23.71],
[-78.03405, 24.28615],
[-78.40848, 24.57564],
[-78.19087, 25.2103],
[-77.89, 25.17],
[-77.54, 24.34],
[-77.53466, 23.75975]
]
],
[
[
[-77.82, 26.58],
[-78.91, 26.42],
[-78.98, 26.79],
[-78.51, 26.87],
[-77.85, 26.84],
[-77.82, 26.58]
]
],
[
[
[-77, 26.59],
[-77.17255, 25.87918],
[-77.35641, 26.00735],
[-77.34, 26.53],
[-77.78802, 26.92516],
[-77.79, 27.04],
[-77, 26.59]
]
]
]
}
}
]
}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
