Javascript 尝试获取动态位置（纬度和经度）以在PlacesAPI中使用它
我正在尝试建立一个小项目，在这个项目中，我们可以通过单击单选按钮获得半径约5公里的特定附近位置（学校、医院、咖啡馆等）。在这里，我尝试使用地理位置获取动态位置（纬度和经度），以便我可以获得用户当前使用此应用程序的位置。发生了什么，当第一个单选按钮被选中时，地图没有在页面加载上加载，但是当我切换到其他单选按钮时，它工作正常 我不是JavaScript方面的专家 下面是我的HTML代码Javascript 尝试获取动态位置（纬度和经度）以在PlacesAPI中使用它,javascript,html,geolocation,google-places-api,Javascript,Html,Geolocation,Google Places Api,我正在尝试建立一个小项目，在这个项目中，我们可以通过单击单选按钮获得半径约5公里的特定附近位置（学校、医院、咖啡馆等）。在这里，我尝试使用地理位置获取动态位置（纬度和经度），以便我可以获得用户当前使用此应用程序的位置。发生了什么，当第一个单选按钮被选中时，地图没有在页面加载上加载，但是当我切换到其他单选按钮时，它工作正常 我不是JavaScript方面的专家 下面是我的HTML代码 <!DOCTYPE html> <html lang="en"> <head>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Google Maps</title>
<style>
#map {
height: 100%;
width: 100%;
}
#box{
height:500px;
width:80%;
margin-left:10%;
margin-right:10%;
border:2px solid black;
}
h1{
text-align:center;
font-family:sans-serif;
}
form {
text-align: center;
}
</style>
</head>
<body>
<h1>Google Maps</h1>
<form>
<input type="radio" id="school" name="places" value="School" checked onClick="load();">Schools
<input type="radio" id="hospital" name="places" value="Hospital" onClick="load();">Hospitals
<input type="radio" id="cafe" name="places" value="Hotel" onClick="load();">Cafes
<input type="radio" id="atm" name="places" value="atm" onClick="load();">ATM's
</form>
<br>
<div id="box">
<div id="map"></div>
</div>
<script type = "text/javascript" src="maps.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBVOCb1nOuIrbnvnTYIYTKMqs2y5ecuMi8&signed_in=true&libraries=places&callback=load" async defer></script>
</body>
</html>
谷歌地图
#地图{
身高：100%；
宽度：100%；
}
#盒子{
高度：500px；
宽度：80%；
左边距：10%；
保证金权利：10%；
边框：2件纯黑；
}
h1{
文本对齐：居中；
字体系列：无衬线；
}
形式{
文本对齐：居中；
}
谷歌地图
学校
医院
咖啡馆
自动取款机
var map;
var infowindow;
var myLat;
var myLong;
x = navigator.geolocation;
x. getCurrentPosition(success);
function success(position){
myLat = position.coords.latitude;
myLong = position.coords.longitude;
}
function load() {
//var hyderabad = {lat: 17.46724, lng: 78.53591};
var hyderabad = new google.maps.LatLng(myLat , myLong);
map = new google.maps.Map(document.getElementById('map'), {
center: hyderabad,
zoom: 12
});
infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map);
var place;
if (document.getElementById('school').checked) {
place = "school"
}
else if (document.getElementById('hospital').checked) {
place = "hospital"
}
else if (document.getElementById('cafe').checked) {
place = "cafe"
}
else if (document.getElementById('atm').checked) {
place = "atm"
}
service.nearbySearch({
location: hyderabad,
radius: 5000,
type: [place]
}, 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, 'mouseover', function() {
infowindow.setContent(place.name);
infowindow.open(map, this);
});
}
var映射；
var信息窗口；
var myLat；
var myLong；
x=navigator.geolocation；
十,。getCurrentPosition（成功）；
功能成功（职位）{
myLat=位置坐标纬度；
myLong=位置坐标经度；
}
函数加载（）{
//var hyderabad={lat:17.46724，lng:78.53591}；
var hydrabad=new google.maps.LatLng（myLat，myLong）；
map=new google.maps.map（document.getElementById（'map'）{
中心：海得拉巴，
缩放：12
});
infowindow=new google.maps.infowindow（）；
var service=newgoogle.maps.places.PlacesService（地图）；
var place；
if（document.getElementById（'school'）。选中）{
place=“学校”
}
else if（document.getElementById（'hospital'）。选中）{
地点=“医院”
}
else if（document.getElementById（'cafe'）。选中）{
place=“咖啡馆”
}
else if（document.getElementById（'atm'）。选中）{
place=“atm”
}
服务，近距离搜索({
地点：海得拉巴，
半径：5000，
类型：[地点]
}，回调）；
}
函数回调（结果、状态）{
if（status==google.maps.places.PlacesServiceStatus.OK）{
对于（var i=0；i