2

我正在尝试让 Leaflet 地图与 PhoneGap 应用程序一起使用，但地图不会全屏呈现，我不知道为什么。

索引.html

<div data-role="content" id="map" style="width:100%;height:70%;position:absolute;">
  var map = new Map();
  var $map = $('#map');
  $map.height( $(window).height() - $map.offset().top );

地图.js

function Map() {
var map = L.map('map').setView([51.505, -0.09], 13);

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
            }).addTo(map);

L.marker([51.5, -0.09]).addTo(map)
.bindPopup('A pretty CSS3 popup. <br> Easily customizable.')
.openPopup();
}

但是我一直在地图最右边的地方得到这个，并且不会在其他任何地方加载：

http://postimage.org/image/r0e49wgt5/

（不会让我发布有声望的图片）

更新

如果我打开应用程序横向，地图将加载，但如果我保持纵向，地图将是灰色的

4

1 回答 1

2

map.invalidateSize();显示地图后尝试。

于 2013-02-19T14:39:18.947 回答