Question

我正在制作自定义游戏地图。此贴图基本上是栅格图像，覆盖有一些路径和标记。我想使用Leaflet来显示地图。

我正在努力的是，Leaflet使用纬度和经度计算位置，而它使用米距离（路径长度，圆的半径等）。

在处理像我们的地球这样的球形世界时，这是非常容易理解的，但它使自定义地图复杂化了很多。

我希望能够在与距离相同的单位中指定位置。

现在，默认情况下，Leaflet使用球形墨卡托投影。根据{{3}}，可以定义自己的投影和坐标参考系统，但到目前为止我无法做到这一点。

这怎么可能？或者有更简单的方法吗？

Answer 1

您应该看一下Leaflet附带的简单坐标参考系统（L.CRS.Simple）：

一个简单的CRS，可以将经度和纬度直接映射到x和y。可用于平面地图（例如游戏地图）。

您可以定义L.Map的CRS，而不是初始化，如下所示：

new L.Map('myDiv', {
    crs: L.CRS.Simple
});

进一步阐述：正如@ghybs在下面的评论中指出的以及对您的问题的评论，默认的精确墨卡托投影（L.CRS.EPSG3857）已经以米为单位。当您计算两个坐标之间的距离时，Leaflet返回米，例如：

var startCoordinate = new L.LatLng(0, -1);
var endCoordinate = new L.LatLng(0, 1);

var distance = startCoordinate.distanceTo(endCoordinate);

console.log(distance);

上面会将222638.98158654713打印到您的控制台，这是两个坐标之间的距离（以米为单位）。问题是，当使用球形投影时，两个坐标之间的距离将越来越小，从赤道开始，这将在创建平坦的游戏世界时成为问题。这就是为什么你应该使用L.CRS.Simple，你不会有问题。

Leaflet JS：使用米而不是纬度的自定义2D投影，长

1 个答案: