为什么我必须重新加载页面才能正确显示地图？

我问这个问题已经here，不幸的是问题不能解决，所以我问这里:)为什么我必须重新加载页面才能正确显示地图？

我有一个JQM页面，其中我显示了一张地图。愚蠢的是，要正确显示地图，我必须重新加载页面。

这是地图上如何显示在页面的第一负载： Site before reload

，这是它如何被刷新页面后显示： Site before reload

这里是我的代码：

var map; 
    require([ 
       "esri/map", 
       "dojo/dom", 
       "esri/layers/ArcGISTiledMapServiceLayer", 
       "dojo/domReady!" 
      ], 
      function (Map, dom, Tiled) { 
       map = new Map("map", { 
        logo: false, 
        minZoom: 1, 
        maxZoom: 11 
       }); 
       var luftbild = new Tiled(URL); 
       map.addLayer(luftbild); 
    });

这就是我怎样称呼地图：

<style> 
    html, body, #map { 
     padding: 0; 
     margin: 0; 
     height: 100%; 
    } 
</style>

我该如何显示它：

<div data-role="page" style="background-color:red" ...> 
    <!--Header--> 
     .... 
    <!--/Header--> 
    <!--Content--> 
     <div id="map"> 
     </div> 
    <!--/Content--> 
</div>

编辑：

把行此代码后：

$(document).on("pageshow","#page",function(){ // initialize map and show 
});

地图现在看起来是这样的： enter image description here

是否有可能将宽度和高度设置为100％？

来源

2014-10-16 minimen

如果直接转到该地图是将它正确地显示无需重新加载链接？你也可以看看这个答案，看看它是否有帮助http://stackoverflow.com/a/17676873/2220391 – Spokey 2014-10-16 12:06:59

是的，它确实加载 – minimen 2014-10-16 12:11:01

你可以显示你如何加载脚本？ – Spokey 2014-10-16 12:33:07

地图需要一个定义宽度和高度的画布。在Jquery移动页面处理页面不同于普通的html页面。即一个页面（即具有data-role = page的div）一次是可见的，而另一个则不是。所以，在任何网页上初始化地图应与jQuery Mobile的特定页面的事件做称为pageshow

$(document).on("pageshow","#page",function(){ // initialize map and show 
});

来源

2014-10-16 12:42:03

为什么我必须重新加载页面才能正确显示地图？

回答

相关问题