14

I just started to play with leflet/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!?

2 Answers 2

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

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)
    – LarsVegas
    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. 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 Jul 31, 2017 at 22:42
  • thanks for this helpful answer... but WHY did geojson choose to do this??
    – Tommy
    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.

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. 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). 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. Aug 1, 2017 at 22:58
  • Found something in turf, which is a big well supported module: turfjs.org/docs/#flip 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/… Aug 16, 2017 at 23:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.