Question

Is it possible in leaflet to drop marker with 3857 projection on map?

I fond a solution where first translate point to 4326 using proj4js and than drop it on map.

var source = new Proj4js.Proj('EPSG:3857');
    var dest = new Proj4js.Proj('EPSG:4326');
    var p = new Proj4js.Point(-12307.601047734, 6711475.1283642);
    Proj4js.transform(source, dest, p);

  new L.Marker([p.y, p.x], {bounceOnAdd: true}).addTo(map);

is there any other way in core leaflet or leaflet plugin to drop marker without using proj4js library.

Thanks.

Was it helpful?

Solution

After spending good time on internet.i'm finally done it.

var point = new L.Point(-12307.601047734, 6711475.1283642);
var earthRadius = 6378137;
var latlng = L.Projection.SphericalMercator.unproject(
               point.divideBy(earthRadius));

new L.Marker([latlng.lat, latlng.lng], {bounceOnAdd: true}).addTo(map);

OTHER TIPS

Same code into a reusable function:

L.CRS.EPSG3857.unproject = function (point) { // (Point) -> LatLng var earthRadius = 6378137, normalizedPoint = point.divideBy(earthRadius); return this.projection.unproject(normalizedPoint); }

Use it like:

var latlng = L.CRS.EPSG3857.unproject(point);

Example:

var point = new L.Point(-12307.601047734, 6711475.1283642); L.marker(L.CRS.EPSG3857.unproject(point), {bounceOnAdd: true}).addTo(map);

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top