Leaflet 在ajax加载页面中加载传单地图不会呈现平铺?

Leaflet 在ajax加载页面中加载传单地图不会呈现平铺?,leaflet,Leaflet,嗨,我正在做一个phonegap应用程序,它用ajax加载我的子页面,在其中一个页面中,我试图加载一张传单地图。 它不是在渲染瓷砖吗? 我不知道我错过了什么 我将传单css和js文件加载到我的索引文件和应该显示地图的子页面中,我有以下代码: <div id="themappage"> <div id="header" class="toolbar"> <h1>The Map</h1> <a

嗨,我正在做一个phonegap应用程序,它用ajax加载我的子页面,在其中一个页面中,我试图加载一张传单地图。 它不是在渲染瓷砖吗? 我不知道我错过了什么

我将传单css和js文件加载到我的索引文件和应该显示地图的子页面中,我有以下代码:

    <div id="themappage">
       <div id="header" class="toolbar">
        <h1>The Map</h1>
        <a href="#" class="back">BACK</a>
      </div>


    <div id="map"></div>


    <script>
    $(document).ready(function(){


        var map = L.map('map');

            L.tileLayer('http://{s}.tile.cloudmade.com/42dfb943872a465d89807eb88f6a1f4d/997@2x/256/{z}/{x}/{y}.png', {
                maxZoom: 18,
                attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>'
            }).addTo(map);

            function onLocationFound(e) {
                var radius = e.accuracy / 2;

                L.marker(e.latlng).addTo(map)
                    .bindPopup("You are within " + radius + " meters from this point").openPopup();

                L.circle(e.latlng, radius).addTo(map);
            }

            function onLocationError(e) {
                alert(e.message);
            }

            map.on('locationfound', onLocationFound);
            map.on('locationerror', onLocationError);

            map.locate({setView: true, maxZoom: 16});
 });
    </script>
    </div>

地图
$(文档).ready(函数(){
var map=L.map('map');
L.tileLayer('http://{s}.tile.cloudmade.com/42dfb943872a465d89807eb88f6a1f4d/997@2x/256/{z}/{x}/{y}.png'{
maxZoom:18,
属性:“地图数据©;贡献者,图像”
}).addTo(地图);
函数onLocationFound(e){
var半径=e.精度/2;
L.标记(e.latlng).添加到(地图)
.bindPopup(“您在距离此点“+半径+”米范围内”).openPopup();
L.圆(e.板条,半径)。添加到(地图);
}
函数onLocationError(e){
警报(e.message);
}
地图上('locationfound',onLocationFound);
map.on('locationerror',onLocationError);
locate({setView:true,maxZoom:16});
});
任何意见,谢谢

更新
刚刚发现如果我使用http://{s}.tile.osm.org/{z}/{x}/{y}.png代替http://{s}.tile.cloudmake.com/42dfb943872a465d89807eb88f6a1f4d/997/256/{z}/{x}/{y}.png作为磁贴层,那么它会呈现磁贴,为什么cloudemade中的磁贴不会呈现?

当我尝试加载它时,使用该API键时,出现了一个403错误(禁止)。试着再买一个()。OSM工作的原因是它不需要API密钥


API键是url中以42dfb开头的部分。。。然后转到/。用一把好钥匙替换它,你就可以走了。

你好,乔希,谢谢,但这是一把新钥匙,但我会用一把新钥匙测试。谢谢,在这里,我让它与您的代码和不同的API密钥一起工作。所以一定是钥匙坏了。非常感谢乔希。你对在应用程序中离线绘制地图有什么意见吗?一点线索也没有。你可能想问另一个问题。