Coordinate Reflection issue with Leaflet

问题

Salutations all and happy holidays. I Noticed an interesting behavioral quirk while trying to draw polygon layers with L.geoJson(). consider the following code:

var polygonCoords = [
        {"type": "Feature",
        "properties": {"group": "Violations"},
        "geometry": {
            "type" : "Polygon",
            "coordinates": [[
                [-107.69348, 43.22519],
                [-105.48523, 42.99259],
                [-107.7594, 42.26105]
            ]]
       }
    }];

and

var polygons = L.polygon([
        [43.22519, -107.69348],
        [42.99259, -105.48523],
        [42.26105, -107.7594]
    ]);

Now, both work in their respective contexts. I was just wondering why the coordinate matrix within L.polygon() has to be reflected in order to show up where one expects it to be when passed into L.goeJson() like so:

var jsonPoly = L.geoJson(polygonCoords, {
        style: function(feature) {
            if (feature.properties.group == "Violations") {
                 return {color: "#ff0000"};
            }
        }
    });

Or is this an oversight within leaflet? Also, is there a way to automate this reflection with say toGeoJson(polygons)?

Thanks so much all.

回答1:

When creating a geoJson layer the coordinates are expected to match the GeoJSON standard (x,y,z or lng, lat, altitude) (GeoJSON position specs)

If you have string of GeoJSON where your coordinates are not in this format, you can create your GeoJSON layer with a custom coordsToLatLng function that will handle this conversion to the standard's format (Leaflet Doc)

If you have a polygon layer and want to add it to an existing GeoJSON feature group you can do something like:

var polygons = L.polygon([
        [43.22519, -107.69348],
        [42.99259, -105.48523],
        [42.26105, -107.7594]
    ]);
var gg = polygons.toGeoJSON();
var jsonFeatureGroup = L.geoJson().addTo(map);
jsonFeatureGroup.addData(gg);
map.fitBounds(jsonFeatureGroup.getBounds());

来源：https://stackoverflow.com/questions/20663604/coordinate-reflection-issue-with-leaflet

标签

javascript

json

leaflet