javascript - 如何将 Leaflet 坐标切换到 0,0 西南方向？

Question

我正在开发一个传单项目，我需要坐标 0 到 4096，我需要的传单坐标如下:

0,0 bottom left (southWest)
0,4096' top left (northWest)
4096',4096' top right (northEast)
4096',0 bottom right (southEast)

我尝试了很多方法来根据需要获取坐标来绘制 map ，但没有成功。这是我的jsfiddle以我的示例为例，当您单击显示坐标的 map 时，它有一个 console.log 。如果您单击左上角，您将看到它的 0,0，如果您单击右下角，您将看到 4096,4096，这与所需值相反。这是我的代码

url = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png';
weight = 4096;
height = 4096;
mapMinZoom = 1;
mapMaxZoom = 7;
map = L.map('map', {
  maxZoom: mapMaxZoom,
  minZoom: mapMinZoom,
  noWrap: true,
  detectRetina: true
});
unproject = function(coord) {
  return map.unproject(coord, 4);
};

southWest = unproject([0, 0]);
northEast = unproject([height, weight]);
map.setMaxBounds(new L.LatLngBounds(southWest, northEast));
tileLayer = L.tileLayer(url, {
  minZoom: mapMinZoom,
  maxZoom: mapMaxZoom,
  noWrap: true,
  tileSize: 256,
  detectRetina: false
}).addTo(map);

map.setView(unproject([0, 0]), 2);

map.on('click', function(e) {
  var coords, latLong;
  latLong = new L.LatLng(e.latlng.lat, e.latlng.lng);
  coords = map.project(latLong, 4);
  console.log("x="+coords.x+", y="+coords.y);
});

Answer 1

如果我理解正确的话，您需要这样的 map 坐标:

[0, 4096] .. [4096, 4096]
.........................
.........................
[0, 0] ........ [4096, 0]

垂直坐标在向上时增加(如Leaflet上的纬度)，水平坐标在向右时增加(如Leaflet上的经度)，这是很好的。所以你似乎不需要反转垂直轴。

至于坐标的顺序，不幸的是Leaflet首先使用的是纬度，其次是经度，并且原生几乎不可能切换它们。但是，您可以轻松构建一个仅交换坐标的包装方法。 (类似于 Leaflet LatLngBounds with simpler CRS & projection ，但不需要使用负垂直坐标 -y 因为在您的情况下您希望它与纬度方向相同)

那么另一个问题是您想要这 4 个 Angular 之间的坐标。默认 CRS (Web Mercator) 沿垂直轴不是线性的。如果您需要线性坐标，则应使用 L.CRS.Simple 。请参阅传单 tutorial for non-Earth-based maps .