当不硬编码纬度和经度时，谷歌地图上的图钉会消失
Posted
技术标签:
【中文标题】当不硬编码纬度和经度时，谷歌地图上的图钉会消失【英文标题】：Pin on google maps disappears when not hard coding the latitude and longitude 【发布时间】：2021-06-15 17:44:56 【问题描述】：我目前正在尝试实现一个谷歌地图，它在 IP 地址来自的地方设置一个 pin。我正在使用 javascript 中的地理定位工具。
但是，当我对 lat & lng 进行硬编码时，它工作得很好，但是当我尝试获取坐标时，pin 消失了
这是我的有效代码：
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<style>
*
margin: 0;
padding: 0;
#map
height: 500px;
width: 100%;
</style>
</head>
<body>
<div id="map"></div>
<script>
function initMap(position)
var location = lat: 51.165691, lng: 10.451526;
var map = new google.maps.Map(document.getElementById("map"),
zoom: 4,
center: location
);
var marker = new google.maps.Marker(
position: location,
map: map
);
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCFlvIBD_3jTrQgDAyj9RMLOdR9cqYZoco&callback=initMap"></script>
</body>
</html>
这是更改后的代码，不再起作用：
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<style>
*
margin: 0;
padding: 0;
#map
height: 500px;
width: 100%;
</style>
</head>
<body>
<div id="map"></div>
<script>
function initMap(position)
var location = lat: 51.165691, lng: 10.451526;
var map = new google.maps.Map(document.getElementById("map"),
zoom: 4,
center: location
);
if (navigator.geolocation)
navigator.geolocation.getCurrentPosition(showPosition)
else
return "Not available";
var a = position.coords.latitude;
var b = position.coords.longitude;
var marker = new google.maps.Marker(
position: lat: a, lng: b,
map: map
);
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCFlvIBD_3jTrQgDAyj9RMLOdR9cqYZoco&callback=initMap"></script>
</body>
</html>
编辑：我被禁止提问，因为我的问题没有被赞成，但得到了回答，并且在 cmets 中进行了一些很好的讨论。但是堆栈交换团队告诉我编辑我的问题以使其更清楚，但他们收到了答案，所以我认为他们很清楚。我不是以英语为母语的人，所以我的英语不是最好的，我无法表达自己那么好。但是他们告诉我编辑它们，使它们看起来像新的并且可以被投票。我不明白为什么这样做是有道理的，但如果我对已经解决的问题获得了一些支持，也许它会解除我的问题禁令，所以如果你不介意，请支持。
【问题讨论】：
position.coords.latitude和position.coords.longitude的值是多少？
是与location变量中的两个数字风格相同的数字
【参考方案1】：
您应该使用成功回调来访问导航器位置， 请参阅随附的工作示例：
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<style>
*
margin: 0;
padding: 0;
#map
height: 500px;
width: 100%;
</style>
</head>
<body>
<div id="map"></div>
<script>
function initMap(position)
var location = lat: 51.165691, lng: 10.451526;
var map = new google.maps.Map(document.getElementById("map"),
zoom: 4,
center: location
);
if (navigator.geolocation)
navigator.geolocation.getCurrentPosition(function(pos)
var a = pos.coords.latitude;
var b = pos.coords.longitude;
var marker = new google.maps.Marker(
position: lat: a, lng: b,
map: map
);
);
else
return "Not available";
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCFlvIBD_3jTrQgDAyj9RMLOdR9cqYZoco&callback=initMap"></script>
</body>
</html>【讨论】：
我刚刚尝试了你的解决方案，但它仍然没有显示标记。我正在尝试解决这个问题 3-4 个小时。f*** :D 也许您需要允许您的浏览器共享位置？ 是的，我也这么认为，但这是允许的，而且我以纯文本形式获得坐标.. 但是 pin 不能“使用”然后 上面的代码对我有用，它显示了欧洲的地图，然后它固定了我的位置......以上是关于当不硬编码纬度和经度时，谷歌地图上的图钉会消失的主要内容，如果未能解决你的问题，请参考以下文章
如何创建一个包含纬度和经度的数组并使用 for 循环在 android 中标记谷歌地图上的位置