Javascript 传单：瓷砖和负y坐标未对齐

我试图生成一个自定义的非地理地图与传单使用我自己的瓷砖

目前，我使用imagemagick创建了10x10个大小为256x256px的虚拟瓷砖，每个瓷砖具有随机的纯色。 它们被放置在public/map tiles/1/map_x_y.png中，其中x的取值范围为0到9（分别为y）

由于这是一张非地理地图，我注意将crs更改为L.crs.Simple（请参阅）：

但是，这会使瓷砖发生轻微移动，从而导致错位：

此外，将获取y坐标为负的分幅，这将导致404d请求，如控制台中所示

这种行为的原因是什么

编辑1：正如IvanSanchez所指出的，不对齐是由缺少的传单.css样式表造成的

我仍然有负坐标的问题。正如建议的那样，我添加了边界（参见上面更新的代码）。意见：

• 有边界[[0,0]，[25602560]]：不显示全部平铺，空白屏幕
• 边界[[-1280，-1280]，[1280，1280]]：显示所有分幅，但获取的负分幅（例如（5，-1））导致404

编辑2：经过几次测试后，看起来负片确实是y轴处理的产物（）。原点位于左上角，y向下。我希望从原点下方取回瓷砖，而不是从上方取回

为了保持x和y同时增加的约定（即x向右增加，y向下增加，具有正坐标分量的平铺从0到9获取），我尝试了什么：

• tileLayer的设置

  tms:true

  。未成功，仍获取y为负的磁贴
• 将tileLayer源路径中的

  {y}

  更改为

  {-y}

  。导致

  错误：没有为变量{-y}

  提供值。我的脚本使用传单1.3.1

---

在带有

L.CRS.Simple

的地图中，默认情况下，所有

TileLayer

都有无限的边界

如果希望

tillelayer

仅在给定区域请求平铺，请阅读，特别是名为

bounds

的

tillelayer

选项（继承自

GridLayer

选项）。让我引述：

bounds

键入

LatLngBounds

默认值

未定义

如果设置，则磁贴将仅加载到集

LatLngBounds

内

你还提到：

奇怪的是，它试图获取具有负坐标的瓷砖[…]

这并不奇怪，这是设计的行为。负坐标并没有本质上的错误（也不奇怪），负磁贴坐标是有效的，并且

---

因此，如果您有大小从[0,0]到[10,10]的256px的10x10块瓷砖，您可能需要类似于

L.tileLayer('/map-tiles/map_{x}_{y}.png', {
  bounds: [[0, 0], [2560, 2560]]
}).addTo(map);

L.tileLayer('/map-tiles/map_{x}_{y}.png', {
  bounds: [[-1280, -1280], [1280, 1280]]
}).addTo(map);

如果您的数据中心是[0,0]点，并且您的分幅范围从[-5，-5]到[5,5]，那么您可能需要类似的内容

L.tileLayer('/map-tiles/map_{x}_{y}.png', {
  bounds: [[0, 0], [2560, 2560]]
}).addTo(map);

L.tileLayer('/map-tiles/map_{x}_{y}.png', {
  bounds: [[-1280, -1280], [1280, 1280]]
}).addTo(map);

---

问题归结为两个方面：

• 未对齐：缺少传单.css样式表，只需在页面的HTML中链接即可
• 获取的负分幅：对于传单，y轴向下。我希望平铺从左到右、从上到下提取，原点设置在左上角。取而代之的是负y。由于我的tile的名称是map_x_y.png，其中x和y取{0:9}中的值，因此导致404d请求。设置负边界修复了

  边界：[[0,0]，-12301230]

  的问题（注意减号）。1230对应于缩放0倍于一个平铺的像素大小时的平铺数量

---

谢谢伊万，很抱歉措辞选择不当。。。我的意思是说我最感兴趣。我得到了布丁的概念，但是边界：[[0,0]，[2560,2560]]完全移除了瓷砖（空白区域），并且[-1280，-1280]，[1280,1280]]产生了相同的瓷砖错位。我的map.setView（[0,0]，1]）可能有什么问题吗？哦，等等，不对齐实际上可能是因为您的网页中缺少

传单.css

。您能用这些信息更新您的问题吗？也许是一个链接，看看它是如何失败的？e、 喜欢。如果问题是负坐标（

y

坐标）（请在解释问题时具体点！！），请一直读到最后。我更新了问题。我一到家就会尝试建立一个链接。