我正在使用谷歌地圖使用手機差距。它正在使用jquerymobile框架創建的移動網站上工作,但是當我使用phonegap在Eclipse中將項目複製到模擬器上進行測試時,它不起作用。它在實際設備上工作,但不能在仿真器上工作。谷歌API使用phonegap不顯示地圖和赤裸裸和赤腳
代碼文件:
config.xml中
<access origin="*" subdomains="true"/>
<access origin="google.com"; />
<access origin="maps.google.com"/>
<access origin="google.com"; />
<access origin="maps.google.com*"/>
的index.html
<!DOCTYPE HTML>
<html>
<head>
<title>Test</title>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<!-- CSS Style Sheetes -->
<link href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" type="text/css" href="css/stylesheet.css" />
<link rel="icon" href="images/IconTaxi.png" type="image/x-icon">
<!-- JavaScript -->
<script src="js/jquery.js" type="text/javascript"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script>
<script src="js/cordova.js" type="text/javascript"></script>
</head>
<body>
<div data-role="page" id="page">
<div class="headerStyle">
<h2 class="headingHeader"><img class="headerImage" src="images/flag.png" alt"United Arab Emirates"/></h2>
</div>
<div class="logo"></div>
<h1 class="headingImage">Welcome </h1>
<div data-role="content">
<ul data-role="listview" class="mainmenu">
<li><a href="companyList.html">Get Companies</a></li>
<li><a href="#AboutUs">About Us</a></li>
</ul>
</div>
</body>
</html>
在這個頁面上我顯示的地圖上,當用戶userRequest.html開關:
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<div id="userRequest" data-role="page" >
<div data-role="header" data-position="fixed">
<a href="companyList.html" data-role="button" class="ui-btn-left" data-icon="back" data-inline="true" data-transition="slide" data-theme="e">Back</a>
<h1 id="getComapnyHeader"></h1>
</div>
<div data-role="content" id="requestForm" style="background:none">
<div class="content-primary">
<form id="userOrder">
<div style="padding:10px 0px;">
<label for="userName" class="ui-hidden-accessible">Username:</label>
<input type="text" name="userName" required ="required" id="userName" value="" placeholder="Your Name" required data-theme="e" />
<label for="userPhone" class="ui-hidden-accessible">PhoneNumber:</label>
<input type="tel" name="userPhone" required ="required" id="userPhone" value="" placeholder="PhoneNumber" required data-theme="e" />
</div>
<div id="map"></div>
</form>
</div>
</div>
</body>
</html>
main.js
$(document).ready(function() {
// setup global error handler
window.onerror = function (message, url, lineNumber) {
console.log([lineNumber, url, message].join(" "));
return false;
};
console.log("document.ready");
console.log(window.location.hash);
// start the app
app.init();
});
var app = app || { _timeStart: null };
app.init = function() {
app.Lati = 0;
app.longi = 0;
$('#userRequest').live('pageshow', function(e) { app.getGeoLocation(e); });
});
};
app.getGeoLocation = function(e) {
navigator.geolocation.getCurrentPosition(app.onGeoSuccess, app.onGeoError);
};
app.onGeoError = function(error) {
if(error == 1)
{
alert("Turn On Geo Location");
}
};
app.onGeoSuccess = function(position)
{
var lat = position.coords.latitude;
var lon = position.coords.longitude;
var currentPosition = new google.maps.LatLng(lat, lon);
var mapOptions = {
zoom: 12,
center: currentPosition,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: true
};
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
var marker = new google.maps.Marker({
position: currentPosition,
map: map,
});
app.Lati = lat;
app.longi = lon;
console.log(app.Lati);
};
有在logcat的任何錯誤? –
不,沒有錯誤相關。甚至相同的代碼工作正常瀏覽器甚至越來越經緯度和顯示地圖,但是當我使用此代碼fororid使用phonegap它不工作 這裏在confif.xml文件我添加 <訪問起源=「」子域=「 true「/>
Wajihurrehman