Javascript 使用lat,long从我的位置获取五个最近的地理位置名称

Javascript 使用lat,long从我的位置获取五个最近的地理位置名称,javascript,google-maps,geolocation,Javascript,Google Maps,Geolocation,我试图根据用户位置显示信息。所以,这里我想根据用户的位置显示五个最近的位置名称 如何使用JavaScript实现这一点。帮帮我。Javascript使您能够获取用户的地理位置。就这些 如果你想在地理位置附近找到一些地方,你需要使用任何地理服务API,如谷歌地图、yandex地图等 我建议你看看这个回购协议: 此外,您可以在此处看到所需内容的示例: 您需要使用: 获取您所在位置附近的位置列表 按距离分类 去5个最近的地方 在地图下的列表中显示它们 您需要加载两个Google地图库:位置和几何体 别

我试图根据用户位置显示信息。所以,这里我想根据用户的位置显示五个最近的位置名称


如何使用JavaScript实现这一点。帮帮我。

Javascript使您能够获取用户的地理位置。就这些

如果你想在地理位置附近找到一些地方,你需要使用任何地理服务API,如谷歌地图、yandex地图等

我建议你看看这个回购协议:

此外,您可以在此处看到所需内容的示例:

您需要使用:

获取您所在位置附近的位置列表 按距离分类 去5个最近的地方 在地图下的列表中显示它们 您需要加载两个Google地图库:位置和几何体 别忘了获取谷歌地图api密钥 以下是代码和工作提琴:

HTML:

Javascript:

// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">

var map;
var infowindow;
var currentLat = -33.867;
var currentLng = 151.195;
var list = document.getElementById('places');

function initMap() {
  var currentPoint = {lat: currentLat, lng: currentLng};
  map = new google.maps.Map(document.getElementById('map'), {
    center: currentPoint,
    zoom: 15
  });

  infowindow = new google.maps.InfoWindow();
  var service = new google.maps.places.PlacesService(map);
  service.nearbySearch({
    location: currentPoint,
    radius: 500,
    type: ['store']
  }, callback);
}

function callback(results, status) {
  if (status === google.maps.places.PlacesServiceStatus.OK) {
    var nearestPlaces = getnearestPlaces(results, 5);
    for (var i = 0; i < nearestPlaces.length; i++) {
      listPlaces(nearestPlaces[i]);
    }
  }
}

function getnearestPlaces(places, numberOfResults) {
    var closest = [];
    for (var i = 0; i < places.length; i++) {
        var fromPoint = new google.maps.LatLng(currentLat, currentLng);
        var toPoint = new google.maps.LatLng(places[i].geometry.location.lat, places[i].geometry.location.lng);
        places[i].distance = google.maps.geometry.spherical.computeDistanceBetween(fromPoint, toPoint);
        closest.push(places[i]);
    }
    closest.sort(sortByDist);
    return closest.splice(0,numberOfResults);
}

function sortByDist(a, b) {
    return (a.distance - b.distance)
}

function listPlaces(place) {
  console.log(place);
  list.innerHTML += '<p>' + place.name + '</p>';
}

谢谢你的回复。我不想在地图上标出他们。我想在地图下方显示位置名称。
/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */
#map {
  height: calc(100% - 200px);
}
/* Optional: Makes the sample page fill the window. */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

#places {
  background-color: #fff;
  height: 200px;
  overflow: auto;
  padding: 10px 15px;
}
// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">

var map;
var infowindow;
var currentLat = -33.867;
var currentLng = 151.195;
var list = document.getElementById('places');

function initMap() {
  var currentPoint = {lat: currentLat, lng: currentLng};
  map = new google.maps.Map(document.getElementById('map'), {
    center: currentPoint,
    zoom: 15
  });

  infowindow = new google.maps.InfoWindow();
  var service = new google.maps.places.PlacesService(map);
  service.nearbySearch({
    location: currentPoint,
    radius: 500,
    type: ['store']
  }, callback);
}

function callback(results, status) {
  if (status === google.maps.places.PlacesServiceStatus.OK) {
    var nearestPlaces = getnearestPlaces(results, 5);
    for (var i = 0; i < nearestPlaces.length; i++) {
      listPlaces(nearestPlaces[i]);
    }
  }
}

function getnearestPlaces(places, numberOfResults) {
    var closest = [];
    for (var i = 0; i < places.length; i++) {
        var fromPoint = new google.maps.LatLng(currentLat, currentLng);
        var toPoint = new google.maps.LatLng(places[i].geometry.location.lat, places[i].geometry.location.lng);
        places[i].distance = google.maps.geometry.spherical.computeDistanceBetween(fromPoint, toPoint);
        closest.push(places[i]);
    }
    closest.sort(sortByDist);
    return closest.splice(0,numberOfResults);
}

function sortByDist(a, b) {
    return (a.distance - b.distance)
}

function listPlaces(place) {
  console.log(place);
  list.innerHTML += '<p>' + place.name + '</p>';
}