我正在使用API来获取直播和经度位置。我想显示一个带有平滑移动标记和信息窗口的地图。我使用ajax来获取数据,我也使用了setinterval。但问题是5秒后它会使地图闪烁,然后它会改变它的位置。我想要一个带有轨道的平滑移动标记的地图。我甚至做了很多研究 - 但我无法得到准确的结果。我甚至使用过Angularjs - 但它没有成功。
如果有人可以帮我解决这个问题,我会非常感激。
这是我的代码:
setInterval(function addMarker1()
{
$.ajax({
url: "<?php echo base_url('welcome/ajax_map');?>",
type: "POST",
data: {},
dataType: "json",
success: function(response){
$(response).each(function(key,value)
{
if(key==0)
{
var mapCanvas = document.getElementById("map");
var res = value.split(",");
/* alert(res[0]);
alert(res[1]); */
var mapOptions = {
center: new google.maps.LatLng(res[0],res[1]),
zoom: 16,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(mapCanvas, mapOptions);
var marker = new google.maps.Marker({
position: value,
icon: 'http://58.254.202.73/808gps/ttxmap/google/image/1/online/1.png',
map: map
});
var latlng = new google.maps.LatLng(res[0],res[1]);
marker.setPosition(latlng);
var contentString = '<div id="content">'+
'<div><strong><span id="1"></span></strong></div>'+
'<div><strong>position: </strong><span id="0"></span></div>'+
'<div><strong>Time: </strong><span id="2"></span></div>'+
'<div><strong>Mileage: </strong><span id="3"></span></div>'+
'<div><strong>Speed: </strong><span id="4"></span></div>'+
'</div>';
var infowindow = new google.maps.InfoWindow({ //information window
content: contentString
});
infowindow.open(map,marker);
addMarker1();
}
});
}
});
},500);
addMarker1();