谷歌地图地理定位在拖动或点击过程中不断向中心移动
Posted
技术标签:
【中文标题】谷歌地图地理定位在拖动或点击过程中不断向中心移动【英文标题】：Google Map geolocation keep on going to the centre during dragging or clicking 【发布时间】：2017-05-07 10:38:15 【问题描述】：我很困惑为什么当我拖动时地图会居中（到我当前的位置）。我不确定会发生什么，但我认为这是因为当我拖动/单击时它会循环通过我的 getLocation。这是我的代码
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Class Project</title>
<link href="style.css" rel="stylesheet">
</head>
<body>
<script src="script.js"></script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=(MY_API_KEY)"></script>
<div id="map" onclick= "initMap()">Get your Location</div>
</body>
</html>
script.js
function initMap() //#1
navigator.geolocation.getCurrentPosition(getLocation, errorHandler);
function errorHandler(err)
if(err.code == 1)
alert("Access to your location denied, refresh page.");
else if( err.code == 2)
alert("Error: Position is unavailable!");
function getLocation(position)
var msg =
info: '<strong>Madison Square Garden</strong><br>\
4 Pennsylvania Plaza<br> New York, NY 10001, USA<br>\
<a href="https://www.google.com.au/maps/place/Madison+Square+Garden/@40.7505045,-73.9934387,15z/data=!4m5!3m4!1s0x0:0x33df10e49762f8e4!8m2!3d40.7505045!4d-73.9934387?sa=X&ved=0ahUKEwjNpdHKyN3TAhVJk5QKHdvOCTEQ_BIIjgEwDA">Get Directions</a>',
lat: 40.7505045,
long: -73.9934387
;
var locations = [
[msg.info, msg.lat, msg.long, 0],
];
var latitude = position.coords.latitude,
longitude = position.coords.longitude;
var map = new google.maps.Map(document.getElementById('map'),
zoom: 17,
center: new google.maps.LatLng(latitude, longitude),
mapTypeId: google.maps.MapTypeId.ROADMAP
);
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++)
marker = new google.maps.Marker(
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
);
google.maps.event.addListener(marker, 'click', (function (marker, i)
return function ()
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
)(marker, i));
【问题讨论】：
【参考方案1】：这是因为地图渲染 div 中的onclick= "initMap()"。
问题是因为您使用 onclick 加载地图。如果拖动地图，则触发onclick事件并再次加载地图。
您应该使用window.onload=initMap() 加载地图或使用按钮加载地图onclick，如下所示。
应该是
<button onclick= "initMap()">
Load Map
</button>
<div id="map" >Get your Location</div>
Fiddle演示
【讨论】：
感谢您的回答，是否可以在点击时摆脱按钮？ 是的，您可以删除按钮。您可以在脚本 src url 中看到&callback=initMap 。加载时调用 map 就足够了以上是关于谷歌地图地理定位在拖动或点击过程中不断向中心移动的主要内容，如果未能解决你的问题，请参考以下文章