-1
我试图获得以下科尔多瓦地理位置示例（https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-geolocation/#find-stores-near-you），但未提供HTML。总之，我需要应用程序来获取用户的当前位置以及列出附近的餐馆。我尝试使用Google Places API的示例中通常使用的即兴功能，但没有运气。我没有收到控制台中的错误消息。科尔多瓦地理位置示例不能正常工作
我得到的输出是：
navigator.geolocation效果很好
45.5039025 -73.5639405
我的代码：
<head>
<style>
#map{height:100%; width:100%;}
</style>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyATmobTWsilWKnIIhYzzHbjT6WEQp8K7kc&libraries&libraries=places"></script>
<script>
var Map;
var Infowindow;
var Latitude = undefined;
var Longitude = undefined;
// Get geo coordinates
function getPlacesLocation() {
navigator.geolocation.getCurrentPosition
(onPlacesSuccess, onPlacesError, {enableHighAccuracy:true});
}
// Success callback for get geo coordinates
var onPlacesSuccess = function (position) {
Latitude = position.coords.latitude;
Longitude = position.coords.longitude;
console.log(Latitude + " " + Longitude);
}
// Get places by using coordinates
function getPlaces(latitude, longitude) {
console.log("Here");
var latLong = new google.maps.LatLng(latitude, longitude);
var mapOptions = {
center: new google.maps.LatLng(latitude, longitude),
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
Map = new google.maps.Map(document.getElementById("places"), mapOptions);
Infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(Map);
service.nearbySearch({
location:latLong,
radius:1500,
type:['restaurant']
}, foundStoresCallback);
}
// Success callback for watching your changing position
var onPlacesWatchSuccess = function (position) {
var updatedLatitude = position.coords.latitude;
var updatedLongitude = position.coords.longitude;
if (updatedLatitude != Latitude && updatedLongitude != Longitude) {
Latitude = updatedLatitude;
Longitude = updatedLongitude;
getPlaces(updatedLatitude, updatedLongitude);
}
}
// Success callback for locating stores in the area
function foundStoresCallback(results, status) {
if (status === google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
createMarker(results[i]);
}
}
}
// Place a pin for each store on the map
function createMarker(place) {
var placeLoc = place.geometry.location;
var marker = new google.maps.Marker({
map: Map,
position: place.geometry.location
});
google.maps.event.addListener(marker, 'click', function() {
Infowindow.setContent(place.name);
Infowindow.open(Map, this);
});
}
// Error callback
function onPlacesError(error) {
console.log('code: ' + error.code + '\n' + 'message: ' + error.message + '\n');
}
// Watch your changing position
function watchPlacesPosition() {
return navigator.geolocation.watchPosition
(onPlacesWatchSuccess, onPlacesError, {enableHighAccuracy:true});
}
</script>
</head>
<body>
<nav id="menu" class="menu">
<div data-bind="with: selectedLanguage">
<a href="index.html">
<header class="menu-header">
<span data-bind="text:home" class="menu-header-title">Home</span>
</header>
</a>
<a href="upcoming_plates.html">
<header class="menu-header">
<span data-bind="text:upcoming" class="menu-header-title">Upcoming Plates</span>
</header>
</a>
<a href="previous_plates.html">
<header class="menu-header">
<span class="menu-header-title">Previous Plates</span>
</header>
</a>
<a href="notifications.html">
<header class="menu-header">
<span class="menu-header-title">Notifications</span>
</header>
</a>
<a href="preferences.html">
<header class="menu-header">
<span class="menu-header-title">Preferences</span>
</header>
</a>
<a href="invite.html">
<header class="menu-header">
<span class="menu-header-title">Invite</span>
</header>
</a>
<a href="feature_my_restaurant.html">
<header class="menu-header">
<span class="menu-header-title">Feature My Restaurant</span>
</header>
</a>
<a href="account_settings.html">
<header class="menu-header">
<span class="menu-header-title">Account Settings</span>
</header>
</a>
</div>
</nav>
<main id="panel" class="panel">
<header class="panel-header">
<button class="btn-hamburger js-slideout-toggle"></button>
<h1 class="title">Title</h1>
<select data-bind="options:languages, optionsText:'name', value:selectedLanguage"></select>
</header>
<section class="box">
<div id="map"></div>
</section>
<!--
<footer class="panel-footer">
<p>with <span class="heart">❤</span> by <a href="https://getmango.com/en" target="_blank">Mango</a></p>
</footer>
-->
</main>
<script src="dist/slideout.js"></script>
<script src="js/languages.js"></script>
<script>
window.onload = function() {
var Language = function (language) {
this.name = language.name;
this.home = language.home;
this.upcoming = language.upcoming;
//this.header = language.header;
//this.subHeader = language.subHeader;
//this.body =language.body;
};
var ViewModel = function (data) {
var self = this;
self.languages = ko.observableArray(
ko.utils.arrayMap(data, function (i) {
return new Language(i);
}));
self.selectedLanguage = ko.observable();
};
ko.applyBindings(new ViewModel(languages));
var slideout = new Slideout({
'panel': document.getElementById('panel'),
'menu': document.getElementById('menu'),
'side': 'right'
});
document.querySelector('.js-slideout-toggle').addEventListener('click', function() {
slideout.toggle();
});
document.querySelector('.menu').addEventListener('click', function(eve) {
if (eve.target.nodeName === 'A'){slideout.close();}});
};
</script>
<script>
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
getPlacesLocation();
console.log("navigator.geolocation works well");
}
</script>
<script type="text/javascript" src="js/knockout-3.4.2.js"></script>
<script type="text/javascript" src="cordova.js"></script>
</body>
这是为什么被拒绝投票...？ –
嗨。你有没有安装plugin-geolocation：'cordova plugin add cordova-plugin-geolocation'？你是怎么把科尔多瓦加入你的项目的？你已经按照这些步骤？ [cordova getstarted]（https://cordova.apache.org/#getstarted） – ricopo
是的，我安装了两个插件。我发现我的错误。我是我需要以下HTML：
虽然当我尝试它最初它不起作用...可能与其他JS冲突。 –