2013-04-18 91 views
0

對於一個學校項目我必須做一個PhoneGap應用程序。我想用一張地圖做一個div,然後做出興趣點。但它是不可能的在我的android模擬器中,得到了錯誤「referenceError無法找到變量谷歌」。我嘗試了很多我找到的解決方案,我唯一能做的就是在應用程序的頂部顯示一小段地圖,但只能在Internet瀏覽器上顯示。PhoneGap和谷歌地圖

<!DOCTYPE HTML> 
<html> 
<head> 

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 

<script src="jquery.js"></script> 
<link rel="stylesheet" href="jquery.mobile-1.3.0.css" /> 

<script src="jquery.mobile-1.3.0.js"></script> 
<script src="jquery.mobile-1.3.0.min.js"></script> 

<style type="text/css"> 
    #footer { 
     position:fixed; 
     bottom:0; 
     left:0; 
     right:0; 
    } 

    html { height: 100% } 
    body { height: 100%; margin: 0; padding: 0 } 
    #map-canvas { height: 100% } 

</style> 


<script type="text/javascript" 
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBKh2nx6OdT6pdPi-KtPNH_6Lc7Aj9z7d4&sensor=true"> 
</script> 


<script type="text/javascript"> 
    function initialize() { 
    var mapOptions = { 
     center: new google.maps.LatLng(-34.397, 150.644), 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("map-canvas"), 
     mapOptions); 
    } 
    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
</head> 

</head> 

<body> 

如果有人有他的電腦上工作一段代碼,或者找到我的錯誤,我會很高興。 謝謝。

回答

2

以下適用於我的Nexus 4仿真器。主要從Google Maps JavaScript API

<!DOCTYPE HTML> 
<html> 
    <head> 

     <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
     <script scr="jquery.js></script> 
     <link rel="stylesheet" href="jquery.mobile-1.3.0.css" /> 
     <script type="text/javascript" src="cordova-2.4.0.js"></script> 
     <script type="text/javascript" src="jquery.mobile-1.3.0.min.js"></script> 

    <style type="text/css"> 
     html, body, #map-canvas { 
      margin: 0; 
      padding: 0; 
      height: 100%; 
     } 

    </style> 

    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 

    <script type="text/javascript"> 
     function initialize() { 
      var mapOptions = { 
       center: new google.maps.LatLng(-34.397, 150.644), 
       zoom: 8, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
      var map = new google.maps.Map(document.getElementById("map-canvas"), 
              mapOptions); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
     </script> 
</head> 

<body> 
    <div id="map-canvas"></div> 
</body> 
</html> 
+0

非常感謝,它對我的​​AVD有效! – nebra

+0

但是真的很奇怪。如果我的項目中沒有「jquery.js」,則沒有問題,但如果是這樣,我只能看到一個白頁 – nebra

+0

您的www文件夾中是否有名爲「jquery.js」的文件? –