【发布时间】:2015-11-10 02:59:30
【问题描述】:
我正在构建一个使用我们当前位置的应用程序。我正在使用科尔多瓦制作应用程序。我导入了我的 google api 密钥。还使用了cordova-plugin-geolocation。
地图和我的位置没有显示。有人可以帮帮我吗?
我的 index.hml
$scope.checkLocation = function(){
if (window.cordova) {
cordova.plugins.diagnostic.isLocationEnabled(
function(e) {
if (e){
successFunctionCall();
}
else {
alert("Location Not Turned ON");
cordova.plugins.diagnostic.switchToLocationSettings();
}
},
function(e) {
alert('Error ' + e);
}
);
}
}
$scope.getLocation = function(){
$scope.checkLocation();
$scope.supportsGeo = $window.navigator;
$scope.position = null;
$window.navigator.geolocation.getCurrentPosition(function(position) {
showToast('Getting Location...');
$scope.$apply(function() {
$scope.position = position;
var link = "http://maps.google.com/maps?saddr="+$scope.position.coords.latitude+","+$scope.position.coords.longitude+"&daddr="+$scope.address;
$window.open(encodeURI(link), '_blank', 'location=no');
});
}, function(error) {
alert(error);
},{enableHighAccuracy: true});
}
function showToast(message) {
if (window.plugins && window.plugins.toast) {
window.plugins.toast.showShortCenter(message);
}
else $ionicLoading.show({ template: message, noBackdrop: true, duration: 2000 });
}
/* Empty. Add your own CSS if you like */
.scroll {
height: 100%;
}
#map {
width: 100%;
height: 100%;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
<script src="js/controller.js"></script>
<script src="http://maps.googleapis.com/maps/api/js?key=[my_api_key]&sensor=true"></script>
</head>
<body ng-app="starter">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Ionic Blank Starter</h1>
</ion-header-bar>
<ion-content ng-controller="controller">
<div id="map" data-tap-disabled="true"></div>
<a ng-click="getLocation()" class="tab-item">
<i class="icon ion-navigate"></i>Navigate
</a>
</ion-content>
</ion-pane>
</body>
</html>
【问题讨论】:
标签: javascript android geolocation ionic-framework cordova-plugins