我有一个在我们的游戏服务器上生成地图图块的在线游戏。我在实际生成带有这些的在线地图方面取得了一些成功,但事情总是不太正确。
地图图块以tile / {z} / {x} / {y}图案存储,遗憾的是,不是从左上角或左下角开始,而是在中心,因此x和y可以是负值和正值
我一直在尝试几种方法,每种方法都有很大的缺点。我唯一获得的成功就是使用了传单0.7.7,它的开箱即用,只需要很少的代码。
它应该是这样的(传单0.7.7) https://panel.chrani.net/map.php
相同代码,当前传单,y轴乱码和缩放缩放(小册子1.2) https://panel.chrani.net/map2.php
更改代码,当前传单,良好下半部分,缩小缩放(小册子1.2) https://panel.chrani.net/map5.php
我无法对此做出正面或反面,几乎所有可用的帮助都是指地理资料和投影地理服务以及诸如此类的东西。
我有几乎从-80开始的图片网格,-80在最大缩放级别上达到80,80。没有变换,没有翻译。我怎样才能在leflet中表现出来?
我很感激任何关于在哪里寻找的指示。
答案 0 :(得分:1)
地图图块以
存储tile/{z}/{x}/{y}
图案
不,你错了。您的tilelayer将tms
选项设置为true
,这意味着该模式为tile/{z}/{x}/{-y}
。 2016年3月更改了TMS tilelayers的行为,请参阅https://github.com/Leaflet/Leaflet/issues/4338。
这里的问题是TMS假设y
平铺坐标存在最大值,这对于无限CRS是不可能的。
我建议您重新设置切片以反转y
坐标。否则,您可以破解tilelayer的getTileUrl
方法来反转y
坐标。
var tiles = L.tileLayer('https://panel.chrani.net/tiles/{z}/{x}/{y}.png', {});
tiles.getTileUrl = function(coords) {
coords.y = -coords.y;
return L.TileLayer.prototype.getTileUrl.bind(tiles)(coords);
}
var map = new L.Map('leaflet', {
crs: L.CRS.Simple,
layers: [tiles],
center: [0, 0],
zoom: 0
});
致电L.TileLayer.prototype.getTileUrl.bind(...)(...)
是个hackish,但the whole hack works。