我正在开发一个Android应用程序(使用Phonegap构建),需要显示用户的当前位置并在Google Map上加载KMZ文件(使用多边形线)(使用google map api)。
我的应用程序在特定缩放级别加载地图(11),并根据用户的当前位置(减少数据消耗)居中。我注意到对于Android OS 4.2.2,地图根本没有加载,消息显示“访问被拒绝到你当前的位置”。
另一方面,为Android OS 4.1.2,4.3,4.4正确加载地图(没有收到任何消息)。
这是Android 4.2.2的安全问题/错误吗? 或者它是一个与我用来构建APK的Phonegap相关的错误? 我该如何解决这个问题?我需要在移动设备上做任何配置吗?
由于
答案 0 :(得分:0)
它适用于Android 4.2.2或任何其他受支持的版本。您的代码设置可能存在错误。
我刚刚通过创建示例应用程序重新确认。
<强>步骤:强>
(1)在html标题部分中包含 Google API密钥和地图jS链接
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <meta name="msapplication-tap-highlight" content="no" /> <meta name="viewport" content="width=device-width, height=device-height" /> <link rel="stylesheet" type="text/css" href="css/index.css" /> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_VALUE_&sensor=true"></script> <title>Hello World</title> </head> <body> <b>Road View</b> <div id="map-canvas" style="width: 100%; height: 200px"></div> <b>Street View</b> <div id="pano" style="width: 100%; height: 200px;"></div> <b>Live Traffic Update View</b> <div id="traffic" style="width: 100%; height: 200px;"></div> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script> </body> </html>
(2)在 index.js 文件中声明以下函数来渲染地图
var app = {
initialize: function() {
this.bindEvents();
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
onDeviceReady: function() {
app.receivedEvent('deviceready');
app.renderMap();
},
receivedEvent: function(id) {
},
renderMap: function() {
// --- Road View
var fenway = new google.maps.LatLng(42.345573, -71.098326);
var mapOptions = {
center: fenway, zoom: 11
};
var map = new google.maps.Map( document.getElementById('map-canvas'), mapOptions);
// ---- Street View
var panoramaOptions = {
position: fenway,
pov: { heading: 34, pitch: 10 }
};
var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'), panoramaOptions);
map.setStreetView(panorama);
// ---- Live Traffic View
var myLatlng = new google.maps.LatLng(34.04924594193164, -118.24104309082031);
var mapOptions = {
zoom: 13,
center: myLatlng
}
var map = new google.maps.Map(document.getElementById('traffic'), mapOptions);
var trafficLayer = new google.maps.TrafficLayer();
trafficLayer.setMap(map);
}
};
app.initialize();
(3)在 AndroidManifest.xml 文件中添加权限。
(4)将项目API级别设置为所需的版本,例如4.2.2 (5)在设备上运行App,它应该显示三种不同类型的地图视图(道路,街道和实时流量)
答案 1 :(得分:0)
这是我用来在地图上加载KML文件的JS文件代码,获取当前位置,显示标记:
'use strict';
angular.module('ehunter.controllers', []).
controller('RegionListCtrl', ['$scope', '$http', '$window',
function($scope, $http, $window) {
$http.get('regions.json').success(function(data) {
$scope.regions = data;
});
$scope.openBrowser = function(url){
$window.open(url, "_blank", "location=yes");
}
}])
.controller('RegionViewCtrl', ['$scope', '$routeParams',
function($scope, $routeParams) {
$scope.region = angular.fromJson($routeParams.r);
var map;
var src = "MY_SERVER"+ $scope.region.File;
initialize();
function initialize() {
map = new google.maps.Map(document.getElementById('map_canvas'), {
zoom: 11,
mapTypeId: google.maps.MapTypeId.TERRAIN
});
loadKmlLayer(src, map);
}
function loadKmlLayer(src, map) {
var kmlLayer = new google.maps.KmlLayer(src, {
suppressInfoWindows: true,
preserveViewport: true,
map: map
});
}
getLocation();
function getLocation(){
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function displayPosition(position) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(position.coords.latitude, position.coords.longitude),
map: map
});
marker.setVisible(true);
marker.setMap(map);
map.setCenter(marker.position);
});
}}
}])