簡體   English   中英

Openlayers切片無法在PhoneGap應用程序中加載-jQuery Mobile沖突?

[英]Openlayers tiles not loading in PhoneGap app - jQuery Mobile conflict?

作為我的第一個PhoneGap應用程序的一部分,我需要加載一個OpenLayers地圖(最終使用我自己的本地自定義圖塊,但目前,我僅在在線上進行測試,並使用標准的OpenLayers示例)。

但是,當我嘗試在iOS模擬器中初始化地圖時,不希望使用OpenStreetMap或其他方式加載圖塊。 地圖的初始化范圍包括放置控件和版權聲明,但我一直得到藍色的問號框,而不是實時圖塊。 在瀏覽器中獨立測試地圖加載代碼,如果我刪除jQuery Mobile引用似乎正常運行,但是如果我在Xcode中調整文件似乎不起作用,此外,它還會破壞我想要的外觀和行為。 這是已知沖突,有人知道如何解決嗎?

提前致謝!

吉爾斯

<!DOCTYPE html> 
<html> 
<head> 
<title>My Page</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="jquery.mobilecus-1.1.0.min.css"/>
    <script src="js/jquery-1.7.2.js"></script>
    <script src="js/jquery.mobile-1.1.0.min.js"></script>
    <script src="js/sessionstorage.1.4.js"></script>
    <script src="js/OpenLayers.js"></script>

<script type="text/javascript" charset="utf-8">

    $(function() { //ready
    // JQuery stuff trimmed out
    }); //end ready

    var map
    function init() {
       map = new OpenLayers.Map("mapview");
       map.addLayer(new OpenLayers.Layer.OSM());
       var lonLat = new OpenLayers.LonLat( 0.0 ,51.0).transform(
            new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
            map.getProjectionObject() // to Spherical Mercator Projection);
       var zoom=10;
       map.setCenter (lonLat, zoom);
       }
</script>
</head>

<body onload="init();"> 

<div data-role="page" id="page1" class="page">
     //html for first page (no map)
</div><!-- /page -->

<div data-role="page" id="page2" class="page">
    <div data-role="header" data-id="fixedheader" data-position="fixed" >   
    <h1>Fixed header</h1>
        </div><!-- /header -->

    <div data-role="content">
            <div id="leftbar">
            <img src="images/leftbar.png">
        </div><!-- /leftbar -->
        <div id="mapview">
            //map appears here
        </div><!-- /mapview -->
        </div><!-- /content -->

    <div data-role="footer"data-id="fixedfooter" data-position="fixed">
        <a id="ForwardButton">Forward</a><a id = "BackButton" href="#page2">Back</a>
    </div><!--/footer -->

</div><!-- /page -->

</body>
</html>

對不起-忘了我講! 剛發現我需要在Cordova.plist的“ ExternalHosts”中添加對地圖服務器域的引用。 現在圖像似乎可以加載了。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM