15

I just started to play with leaflet/geojson a little. But my coordinates are not rendered properly and I have no clue what is going on.

My coordinates are: 52.23943, 4.97599. They work correct with the setView function.

var map = L.map('leaflet_map').setView([52.23943, 4.97599], 15);

But using a geojasonFeature they are, hmmm, 'projected', somewhere east of Somalia.

var geojsonFeature = { "type": "Feature", "properties": { "name": "Coors Field", "amenity": "Baseball Stadium", "popupContent": "This is where the Rockies play!" }, "geometry": { "type": "Point", "coordinates": [52.23943, 4.97599] } }; var myLayer = L.geoJson().addTo(map); myLayer.addData(geojsonFeature).bindPopup("I am a gjson point.");

Anyone who knows what is happening here?

EDIT

Out of pure curiosity, I changed the coordinates around [4.976143930893815,52.23925499011473] and the point appears at its correct location. A known bug!?

Improve this question

2 Answers 2

Reset to default
26

I wouldn't call it a bug, just a matter of confusing and contradictory standards.

When talking about geographic locations, we usually use Lat-long. This has been codified in the ISO 6709 standard.

When dealing with Cartesian coordinate geometry, we generally use X-Y. Many GIS systems, work with a Geographic Location as a special case of a 2 D coordinate point, where the X represents the longitude and Y represents the Latitude. This order of coordinates, is exactly opposite that of the regular Lat-long notion.

Coming to your problem:

The map.setView takes a l.LatLong as an input, where the first cordinate is a Latitude, and the second is Longitude.

Hence when you want 52.23N, 4.97E, you pass in [52.23943, 4.97599]

The GeoJSON standard says that for any point, the first parameter is the X Coordinate (i.e. Longitude) and second parameter is the Y coordinate (i.e. Latitude);

Hence when you want 52.23N, 4.97E in GeoJSON, you need to pass [4.97599, 52.23943]

For further reading, go through this Q&A

Improve this answer
4
  • Indeed a matter of confusion. I just read the geojson spec and indeed you are absolutely right. Here is the quote The order of elements must follow x, y, z order (easting, northing, altitude for coordinates in a projected coordinate reference system, or longitude, latitude, altitude for coordinates in a geographic coordinate reference system) Commented Mar 11, 2013 at 10:14
  • 1
    @LarsVegas The origin of this issue is the English Language. We usually say Lat-long when we are talking about the geographic location and use X-Y when are talking about coordinate geometry. Commented Mar 11, 2013 at 10:18
  • A summary of which programs and libraries use X,Y and which Y,X pair ordering: macwright.org/lonlat, courtesy Tom MacWrite Commented Jul 31, 2017 at 22:42
  • thanks for this helpful answer... but WHY did geojson choose to do this?? Commented Apr 5, 2018 at 13:36
1

I ve just bumped upon this issue. To anyone experiencing this problem and has a considerable number of lat,long data pairs, you can use the following js:

var a = "[LatLng(37.43943, 25.30563)],[LatLng(37.4367, 25.30495)],[LatLng(37.43071, 25.29945)],[LatLng(37.42362, 25.30426)],[LatLng(37.42089, 25.31113)],[LatLng(37.41489, 25.31113)],[LatLng(37.41053, 25.30769)],[LatLng(37.40235, 25.30563)],[LatLng(37.40562, 25.31525)],[LatLng(37.41816, 25.31937)],[LatLng(37.42307, 25.3228)],[LatLng(37.40889, 25.33104)],[LatLng(37.4078, 25.33722)],[LatLng(37.41598, 25.33791)],[LatLng(37.40344, 25.35027)],[LatLng(37.40726, 25.3688)],[LatLng(37.42253, 25.39009)],[LatLng(37.4138, 25.39902)],[LatLng(37.42907, 25.4052)],[LatLng(37.42961, 25.41962)],[LatLng(37.44215, 25.42442)],[LatLng(37.44543, 25.45807)],[LatLng(37.46287, 25.4615)],[LatLng(37.47595, 25.46013)],[LatLng(37.47104, 25.42786)],[LatLng(37.48249, 25.42923)],[LatLng(37.48358, 25.41)],[LatLng(37.49502, 25.40588)],[LatLng(37.49447, 25.38597)],[LatLng(37.49066, 25.3791)],[LatLng(37.46941, 25.38254)],[LatLng(37.46178, 25.37773)],[LatLng(37.4754, 25.35988)],[LatLng(37.4972, 25.35782)],[LatLng(37.50047, 25.34203)],[LatLng(37.49774, 25.32761)],[LatLng(37.49229, 25.3228)],[LatLng(37.4912, 25.3125)],[LatLng(37.4814, 25.30907)],[LatLng(37.47268, 25.31113)],[LatLng(37.46341, 25.32692)],[LatLng(37.44597, 25.32692)],[LatLng(37.42798, 25.3228)],[LatLng(37.43943, 25.30563)]".split("],["); var b = a.map(function(x) { var couple= (/\d+.\d+, \d+.\d+/g).exec(x).toString(); var splitted = couple.split(", "); return "["+splitted[1]+","+splitted[0]+"]"; } ); b.join();

Edit: according to this SO answer, apparently there is also this method:

L.GeoJSON.coordsToLatLng().

I havent use it but it seems promising.

Improve this answer
6
  • 1
    A useful function. Most inputs would probably be bare coordinate pair lists though - [[60.672744462452,-135.02487602415],[60.673011537554,-135.02487602415]]. I've also seen but not used the geojson-flip nodejs module. Commented Jul 31, 2017 at 22:45
  • Ty for your kind words. It was mostly a solution of the last moment as I was working on a tight schedule. There is actually a method provided by the leaflet library to do exactly that as I ve learned later (cant remember now which but I can check if you want). Commented Aug 1, 2017 at 20:45
  • The name of the Leaflet method would be helpful! I haven't been able to find it, and the geojson-flip module I mentioned above doesn't work with my data. Commented Aug 1, 2017 at 22:58
  • Found something in turf, which is a big well supported module: turfjs.org/docs/#flip Commented Aug 2, 2017 at 7:15
  • 1
    hey, sorry for the long delay, but here is what I was talking about: stackoverflow.com/questions/35983078/… Commented Aug 16, 2017 at 23:49

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.