使用 Google 地图搜索当前位置附近的学校?
Search Nearby School at current location using Google maps?
我想显示当前位置附近的学校,但是我不知道如何合并它们,我制作了一个单独的程序来获取当前位置,但现在我想显示当前位置附近的附近位置。我做了一个fiddle。在这里,我们提供静态经纬度,我希望它们成为我当前位置的经纬度。这样在我当前的位置我可以看到附近的学校
var pyrmont = {lat: -33.867, lng: 151.195};
https://www.w3schools.com/html/html5_geolocation.asp
使用 html5 地理定位获取当前位置,它将 return lat long 然后将其传递给 pyrmont 变量 lat 和 long
请尝试此代码。
这里您需要从脚本标签 callback=initMap 中删除回调,因此它看起来如下所示。
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&libraries=places" async defer></script>
因为首先我们调用 getLocation() 并且在从地理定位获取值之后我们手动调用 initMap();
。
var temp_lat = '';
var temp_lng = '';
var map;
var infowindow;
getLocation();
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
temp_lat = 0.0; //set default lat value
temp_lng = 0.0; //set default lng value
}
}
function showPosition(position) {
temp_lat = position.coords.latitude;
temp_lng = position.coords.longitude;
initMap();
}
function initMap()
{
var pyrmont = {lat: temp_lat, lng: temp_lng};
map = new google.maps.Map(document.getElementById('map'),
{ center: pyrmont, zoom: 15 });
infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map); service.nearbySearch(
{ location: pyrmont, radius: 500, type: ['school'] },
callback); }
function callback(results, status) {
if (status === google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length; i++)
{ createMarker(results[i]); } } } 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); }); }
希望对您有所帮助。
我想显示当前位置附近的学校,但是我不知道如何合并它们,我制作了一个单独的程序来获取当前位置,但现在我想显示当前位置附近的附近位置。我做了一个fiddle。在这里,我们提供静态经纬度,我希望它们成为我当前位置的经纬度。这样在我当前的位置我可以看到附近的学校
var pyrmont = {lat: -33.867, lng: 151.195};
https://www.w3schools.com/html/html5_geolocation.asp 使用 html5 地理定位获取当前位置,它将 return lat long 然后将其传递给 pyrmont 变量 lat 和 long
请尝试此代码。
这里您需要从脚本标签 callback=initMap 中删除回调,因此它看起来如下所示。
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&libraries=places" async defer></script>
因为首先我们调用 getLocation() 并且在从地理定位获取值之后我们手动调用 initMap();
。
var temp_lat = '';
var temp_lng = '';
var map;
var infowindow;
getLocation();
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
temp_lat = 0.0; //set default lat value
temp_lng = 0.0; //set default lng value
}
}
function showPosition(position) {
temp_lat = position.coords.latitude;
temp_lng = position.coords.longitude;
initMap();
}
function initMap()
{
var pyrmont = {lat: temp_lat, lng: temp_lng};
map = new google.maps.Map(document.getElementById('map'),
{ center: pyrmont, zoom: 15 });
infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map); service.nearbySearch(
{ location: pyrmont, radius: 500, type: ['school'] },
callback); }
function callback(results, status) {
if (status === google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length; i++)
{ createMarker(results[i]); } } } 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); }); }
希望对您有所帮助。