3

Leaflet のすべての要素が DOM に表示されているため、Leaflet はレンダリングされていますが、他には何も動きません。私が見るのは灰色だけです。

マップ タイルを表示する唯一の方法は、マップ コンテナーの position:absolute を削除することですが、それによってごちゃごちゃしたマップ タイルが作成されます。GIT の履歴を調べて、誤ってスタイルを変更したかどうかを確認しましたが、うまくいきませんでした。

マップを初期化するコードは次のとおりです。

// init everything on page show
$("#map").live('pageshow',function() {
    if(window.localStorage.getItem("lat")!=undefined) { var lat = window.localStorage.getItem("lat")} else { var lat = '49.264'; }
    if(window.localStorage.getItem("lng")!=undefined) { var lng = window.localStorage.getItem("lng")} else { var lng = '-123.123'; }
    try {         
        var map = window.map
        map = new L.Map('map-container');
        var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/006282296d334e66a593e55aca6b5ce0/54803/256/{z}/{x}/{y}.png';
        var cloudmadeAttribution = 'Map Data © 2011 OpenStreetMap';
        var cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18, attribution: cloudmadeAttribution});
        map.setView(new L.LatLng(lat, lng), 12).addLayer(cloudmade);
        map.invalidateSize();
    } catch(e) {console.log(e)}
    userMarkers[1] = new L.Marker( new L.LatLng( lat,lng ) , {icon: new iconUser, clickable: true} );
    map.addLayer( userMarkers[1] );
});

環境には jQuery モバイルが含まれます。残念ながら、コンソールはエラーをログに記録せず、上記の localStorage は実際に調べたときに有効な LatLng 値を保持しています。

スクリーンショット: スクリーンショット

推測はありますか？

4

1 に答える 1

4

問題がどのように始まったのかはわかりませんが、それを修正するために、すべてのマップ コンテナー スタイルを削除してから、次のように宣言しました。

#map-container {
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin: 0;
    padding: 0;
}

そして今、問題は修正されました。このようなスタイリングを使用したことがないため、問題がどのように発生したかを推測することはできません。

于 2012-04-25T20:09:50.747 に答える