4

I am developing my first leaflet applications. So this is my trial application demo.

       var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
            osm = L.tileLayer(osmUrl, {
                maxZoom: 18,

            });

        var map = L.map('map').setView([51.505, -0.09], 12).addLayer(osm);

I am getting the CRS of the map, and CRS is EPSG:3857.

 console.log("map crs: " + map.options.crs.code)

I can add a point data with EPSG:4326 coordinates.

L.marker([51.5, -0.09]).addTo(map)
.bindPopup('A popup.')
.openPopup();

But I can not add EPSG:3857 coordinates.

    L.marker([5732953.77585,-10018.7582914]).addTo(map)
    .bindPopup('A popup.')
    .openPopup();

This goes wrong place.

7

This is a feature, not a bug. Most Leaflet users are not aware that the map's display CRS is different from the map's data CRS, and that's fine; it makes life simpler for most people.

If your question would have been...

I have data in EPSG:3857 but Leaflet will only accept EPSG:4326 LatLngs, how can I add my data?

Then the answer would have been:

You will have to project your data from EPSG:3857. Use proj4js, or proj4leaflet, or simply:

var coords4326 = L.Projection.SphericalMercator.unproject(coords3857);
  • 1
    I have a doubt here. I believe Leaflet uses EPSG:3857. But my coordinates were EPSG:4326. Now I need to convert EPSG:4326 to EPSG:3857. How can I achieve this? Your answer was for the other way. Correct me If I am wrong in my question. – Balasubramani M Feb 11 at 7:59
  • 1

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.