首先,请理解它可能不是语法的,因为通过翻译器编写。 此代码可获取我的位置,并在地图上标记我周围的位置。 有一个问题,代码没有错误,但是只显示了一些地方,而不是所有地方。 实际上,我的位置附近有四家牙科诊所,但是在地图上只有一家。 你能帮忙吗?
cordova版本:8.0.0
cordova插件列表
cordova-plugin-geolocation 4.0.1 "Geolocation"
cordova-plugin-googlemaps 2.3.8 "cordova-plugin-googlemaps"
cordova-plugin-whitelist 1.3.3 "Whitelist"
所有地图API均已启用。
编写代码时引用的站点
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-geolocation/index.html#get-the-weather-forecast
https://developers.google.com/maps/documentation/javascript/places#place_search_requests
<!DOCTYPE html>
<html lang="ko">
<head>
<title>MAP</title>
<script type="text/javascript" src="cordova.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAxqeI0JlgcG_U2Tbny_ODCOaf1dA7HUM4&libraries=places"></script>
<script>
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
console.log("navigator.geolocation works well");
}
//documentReady
$(document).ready(function(){
getPlacesLocation();
});
</script>
</head>
<body>
<script>
var map;
var service;
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;
getPlaces(Latitude, Longitude);
console.log(Latitude + " " + Longitude);
// Get places by using coordinates
function getPlaces(latitude, longitude) {
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('map'), mapOptions);
Infowindow = new google.maps.InfoWindow();
var request = {
location:latLong,
radius : 10000,
name : 'dentist'
}; //Map
var service = new google.maps.places.PlacesService(Map);
service.nearbySearch(request, callback);
// Success callback for locating stores in the area
function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
var place = results[i];
createMarker(results[i]);
}
}
}//callback
// 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);
}
}
// 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 () {
var infowindow = new google.maps.InfoWindow();
infowindow.open(map, this);
service.getDetails(place, function(details, status) {
if (status === google.maps.places.PlacesServiceStatus.OK) {
infowindow.setContent(details.types + "<br />" + details.name + "<br />" + details.formatted_phone_number +"<br />" +details.formatted_address + "<br />"+details.website);
}
});//getDetails
});//addListener
}//createMarker
}//getPlaces
}//onPlacesSuccess
// 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>
<div id="map" style="width:500px;height:500px;">
</div>
</body>
</html>