在leafletjs中使用3857投影放置标记答案

【问题标题】：Drop Marker with 3857 projection in leafletjs在leafletjs中使用3857投影放置标记
【发布时间】：2014-04-24 10:17:39
【问题描述】：

是否可以在传单中使用 3857 投影在地图上放置标记？

我喜欢一个解决方案，首先使用 proj4js 将点转换为 4326，然后将其放在地图上。

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);

在核心传单或传单插件中是否有其他方法可以在不使用 proj4js 库的情况下删除标记。

谢谢。

【问题讨论】：

标签： javascript gis leaflet projection

【解决方案1】：

在网上度过了愉快的时光。我终于完成了。

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);

【讨论】：

【解决方案2】：

相同的代码变成一个可重用的函数：

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

像这样使用它：

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

例子：

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

【讨论】：

这是一个更好的答案，因为您可以直接使用 map.options.crs.unproject （就像使用 proj4leaflet 一样）并直接进入该功能，感谢分享！