Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to increase the precision of L.geoJson with more than 6 decimals #7462

Closed
CityBelfast opened this issue Feb 9, 2021 · 9 comments
Closed

Comments

@CityBelfast
Copy link

Hi,
I've a geometry with 16 decimal place coordinates. When I load the features via L.geoJson, leaflet is rounding all values to 5 or 6 decimals. Due to this, some of the coordinates are turn into same value in the coordinate list. As a result, we are not getting the accuracy of the geometry. is there any option where we can increase the decimal place in the leaflet while using L.geoJson?

Original Coordinates in the geometry
image

After loading into the layerGroup via L.geoJson
image

@johnd0e
Copy link
Collaborator

johnd0e commented Feb 9, 2021

Related: #6681

@CityBelfast
Copy link
Author

The above mentioned link is the resolution for my issue as I didn't get any idea how to resolve my issue after looking at #6681?

@johnd0e
Copy link
Collaborator

johnd0e commented Feb 10, 2021

Please show sample of your code.
E.g., I do not see any problem using such:

L.geoJson({"type": "Feature",
  "geometry": {
    "type": "Polygon",
    "coordinates": [ [ [1.123456789, 2.123456789], [3.123456789, 4.123456789], [5.123456789, 6.123456789] ] ]
  }
});

@CityBelfast
Copy link
Author

CityBelfast commented Feb 10, 2021

Please see the blow Sample code of mine.

let lyrGroup = new L.featureGroup().addTo(map);
let lyrToMerge = new L.featureGroup().addTo(map);

let data = { "type": "FeatureCollection", "features": [{ "type": "Feature", "geometry": { "type": "Polygon", "coordinates": [[[278657.8499999996, 187313.8000000007], [278652.4000000004, 187304.8499999996], [278652.1840000004, 187304.9810000006], [278650.7429999998, 187302.6699999999], [278649.426, 187302.159], [278646.4589999998, 187303.9460000005], [278646.2290000003, 187305.2449999992], [278646.216, 187305.3169999998], [278647.7000000002, 187307.6999999993], [278653.0999999996, 187316.6999999993], [278657.8499999996, 187313.8000000007]]] }, "properties": {} }] };
L.geoJson(data, {
       coordsToLatLng: function (coords) {        
            let r = GridToLatLng(coords);
        return r;
           },
    onEachFeature: function (feature, layer) {
        layer.bindContextMenu({
            contextmenu: true, contextmenuItems: [
                {
                    text: "Select", index: 0, callback: function () {
                        let fc = lyrGroup.toGeoJSON();
                        L.geoJson(fc, {
                            onEachFeature: function (feature, layer) {
                               lyrToMerge.addLayer(layer);
                                lyrGroup.clearLayers();
                            }
                        });
                    }
                }
            ]
        });
    }
}).addTo(lyrGroup);

function GridToLatLng(xy) {
    let proj4LatLng = proj4("EPSG:27700", "EPSG:4326", xy);
    return L.latLng(proj4LatLng[1], proj4LatLng[0]);
}

layer values on onEachFeature :
image

@johnd0e
Copy link
Collaborator

johnd0e commented Feb 11, 2021

Please see the blow Sample code of mine.

Why not provide ready-to-run sample with all the required data included?
And without any unrelated code

@johnd0e
Copy link
Collaborator

johnd0e commented Feb 11, 2021

Here I do not see any problem:

let lyrGroup = new L.featureGroup().addTo(map);
let lyrToMerge = new L.featureGroup().addTo(map);

let data = { "type": "FeatureCollection", "features": [{ "type": "Feature", "geometry": { "type": "Polygon", "coordinates": [[[278657.8499999996, 187313.8000000007], [278652.4000000004, 187304.8499999996], [278652.1840000004, 187304.9810000006], [278650.7429999998, 187302.6699999999], [278649.426, 187302.159], [278646.4589999998, 187303.9460000005], [278646.2290000003, 187305.2449999992], [278646.216, 187305.3169999998], [278647.7000000002, 187307.6999999993], [278653.0999999996, 187316.6999999993], [278657.8499999996, 187313.8000000007]]] }, "properties": {} }] };
L.geoJson(data, {
    onEachFeature: function (feature, layer) {
        debugger;
    }
}).addTo(lyrGroup);

What is done inside proj4 - I do not know.
But it is not a part of Leaflet anyway.

@johnd0e
Copy link
Collaborator

johnd0e commented Feb 11, 2021

Try this after your code:

console.log(lyrGroup.toGeoJSON().features[0].geometry.coordinates[0]);

And compare output with this:

console.log(lyrGroup.toGeoJSON(10).features[0].geometry.coordinates[0]);

Hint: precision argument.

@CityBelfast
Copy link
Author

CityBelfast commented Feb 11, 2021

Please see the blow Sample code of mine.

Why not provide ready-to-run sample with all the required data included?
And without any unrelated code

Proj4 just convert Actual coordinates into latlng coordinates. I will post an example here shortly.

@CityBelfast
Copy link
Author

lyrGroup.toGeoJSON(10)

yeah sure , I will try passing precision argument in .toGeoJSON

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants