setInterval(function () {initMap();},5000);
//setInterval(function () {changeMarkerPosition(marker);},5000);
var map;
function initMap() {
var lat = document.getElementById( 'lat' ).value;
var lng = document.getElementById( 'lng' ).value;
map = new google.maps.Map(
document.getElementById('map'),
{center: new google.maps.LatLng(lat, lng), zoom: 16});
var iconBase =
'https://developers.google.com/maps/documentation/javascript/examples/full/images/';
var icons = {
parking: {
icon: iconBase + 'parking_lot_maps.png'
},
library: {
icon: iconBase + 'library_maps.png'
},
info: {
icon: iconBase + 'info-i_maps.png'
}
};
var features = [
{
position: new google.maps.LatLng(lat, lng),
type: 'info'
},
];
// Create markers in the map.
for (var i = 0; i < features.length; i++) {
var marker = new google.maps.Marker({
position: features[i].position,
icon: icons[features[i].type].icon,
map: map
});
};
}
这是我的代码,每5秒刷新一次整个地图,而不是我想每5秒刷新一次标记的位置,因为我从两个输入字段中获取经纬度,而这两个字段是持续更新的。
请注意,每次调用google.maps.Map()类时,你都会创建一个Map Load,它的计费方式是 动态地图 SKU. 而不是每隔5秒创建一次地图加载来更新标记位置,你可以利用 setPosition google.maps.Marker类的方法.
这里有一个 示例代码 在这里,我是使用 setPosition 每5秒一次。
下面是代码的分解。
我在这里 设置标记的初始位置
marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Hello World!'
});
这就是 阵列 的坐标,我的标记应该改变位置。
markerList = [
[-33.950198, 151.259302],
[-33.923036, 151.259052],
[-34.028249, 151.157507],
[-33.80010128657071, 151.28747820854187]
];
然后我用 循环 来查看数组中的所有坐标。然后把 setTimeout 在改变标记位置时放5秒的间隔。
for (var i = 0; i < markerList.length; i++) {
(function(index) {
setTimeout(function() {
marker.setPosition(new google.maps.LatLng(markerList[index][0], markerList[index][1]));
}, i * 5000);
})(i);
}
希望对你有帮助