javascript - LeafletJS和Cloudmade:Retina Tile支持

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

我使用这个网址来访问云端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 Book Pro）上都不清晰。

有人做过这个工作吗？

谢谢！

最佳答案

这为我工作：

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);

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

关于javascript - LeafletJS和Cloudmade:Retina Tile支持，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21677504/

CloudMade

javascript - LeafletJS和Cloudmade:Retina Tile支持