LeafletJS & Cloudmade:视网膜贴壁支架

Question

我在我的移动HTML5应用程序中使用传单JS和Cloudmade。不幸的是我无法得到视网膜的支持。

我使用这个url访问云制造的api：

var url = 'http://{s}.tile.cloudmade.com/{key}/{style}@2x/256/{z}/{x}/{y}.png?token={token}';

我的key、style和token被正确的值替换。

对于我的传单映射层，我使用以下简单的配置：

L.tileLayer(url, {
        detectRetina: true
      }).addTo(map);

不幸的是，结果看起来真的很奇怪。

​

瓷砖和瓷砖的位置好像出了问题。

如果删除detectRetina标志，则在浏览器中得到正确的结果。

​

但正如你所看到的，这两种解决方案在我的视网膜显示器上都不是很清晰(Mac )。

有人让这件事行得通吗？

谢谢!

Answer 1

这对我起了作用：

var tileURL = 'http://{s}.tile.cloudmade.com/{api-key}/1714' + (L.Browser.retina? '@2x': '') + '/256/{z}/{x}/{y}.png';          

L.tileLayer(tileURL, {detectRetina: true}).addTo(yourMap);

您是否尝试过不同的瓷砖样式，并检查这是否可能是问题所在？