标记在Google地图上的setPosition后消失 [英] marker disappears after setPosition on google maps
本文介绍了标记在Google地图上的setPosition后消失的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
<！DOCTYPE HTML>
< html>
< head>
< script src =http://maps.google.com/maps/api/js?sensor=false>
< / script>
< script type =text / javascript>
var index = 0;
var latitudes = new Array（35.71434,35.715612,35.711779,35.70913,35.710646）;
var longitudes = new Array（-77.92854，-77.924076，-77.925171，-77.925943，-77.930278）;
var mapOptions;
var coords = new google.maps.LatLng（纬度[指数]，经度[指数]）;
var marker = null;
var map;
var newPoint;
功能自动更新（）{
navigator.geolocation.getCurrentPosition（功能（位置）{
的MapOptions = {
变焦：15，
中心：座标，
MapTypeControl中：真实，
navigationControlOptions：{
风格：google.maps.NavigationControlStyle.SMALL
}，
的mapTypeId：google.maps.MapTypeId.ROADMAP
$; map
map = new google.maps.Map（
document.getElementById（mapContainer），mapOptions
）;
if（marker）{
newPoint = new google.maps.LatLng（latitudes [index]，longitudes [index]）;
marker.setPosition（newPoint）;
}
else {
marker = new google .maps.Marker（{
position：coords，
map：map，
}）;
}
if（newPoint！= null）{
map.setCenter（newPoint）;
marker.setVisible（true）;
}
}）;
index = index + 1;
if（index == 5）{
index = 0;
}
setTimeout（autoUpdate，5000）;
}
autoUpdate（）;
< / script>
< style type =text / css>
#mapContainer {
height：500px;
width：800px;
border：10px solid #eaeaea;
}
< / style>
< / head>
< body>
< div id =mapContainer>< / div>
< / body>
< / html>
感谢您的帮助。
解决方案
将创建映射的代码移出autoUpdate函数，仅在页面加载时运行一次：
的MapOptions = {
变焦：15，
中心：座标，
MapTypeControl中：真，
navigationControlOptions：{
式：google.maps.NavigationControlStyle .SMALL
}，
mapTypeId：google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map（
document.getElementById（mapContainer），mapOptions
）;
或者做一些类似于您对标记的操作，只创建一次已初始化/创建，只需更改中心。
I worked on a GPS position show on google maps. The issue here is that the google mark only appears on the first time (set the google marker part). It will disappeard every time after the setPosition method is called. Any help will be appreciated.
<!DOCTYPE HTML>
<html>
<head>
<script src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
var index=0;
var latitudes = new Array(35.71434,35.715612,35.711779,35.70913,35.710646);
var longitudes = new Array(-77.92854,-77.924076,-77.925171,-77.925943,-77.930278);
var mapOptions;
var coords = new google.maps.LatLng(latitudes[index],longitudes[index]);
var marker = null;
var map;
var newPoint;
function autoUpdate(){
navigator.geolocation.getCurrentPosition(function(position){
mapOptions = {
zoom: 15,
center: coords,
mapTypeControl: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(
document.getElementById("mapContainer"), mapOptions
);
if(marker){
newPoint = new google.maps.LatLng(latitudes[index],longitudes[index]);
marker.setPosition(newPoint);
}
else{
marker = new google.maps.Marker({
position: coords,
map: map,
});
}
if(newPoint!=null){
map.setCenter(newPoint);
marker.setVisible(true);
}
});
index=index+1;
if(index==5){
index=0;
}
setTimeout(autoUpdate,5000);
}
autoUpdate();
</script>
<style type="text/css">
#mapContainer {
height: 500px;
width: 800px;
border:10px solid #eaeaea;
}
</style>
</head>
<body>
<div id="mapContainer"></div>
</body>
</html>
Thank you for your help.
解决方案
Move the code that creates the map out of the autoUpdate function, only run it once on page load:
mapOptions = {
zoom: 15,
center: coords,
mapTypeControl: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(
document.getElementById("mapContainer"), mapOptions
);
Or do something similar to what you do with the marker, only create it once, if it already has been initialized/created, just change the center.
这篇关于标记在Google地图上的setPosition后消失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
