Javascript 在google地图上动态移动多个标记而不重复
我正在使用jquery mobile进行一个phonegap项目。我对google map api不熟悉。我能够从json中获取标记数组并将其显示在地图上&我使用了SetInterval函数从数据库中获取更新的纬度和经度。 问题是由于setInterval函数,标记保持重叠。我从stackoverflow中找到了一个解决方案来删除重复的标记,但现在我的数据库中有两个标记,但这里只显示一个标记。我想更新这两个标记而不重复。 我的代码到现在为止(仅适用于一个标记)Javascript 在google地图上动态移动多个标记而不重复,javascript,google-maps,google-maps-api-3,google-maps-markers,phonegap,Javascript,Google Maps,Google Maps Api 3,Google Maps Markers,Phonegap,我正在使用jquery mobile进行一个phonegap项目。我对google map api不熟悉。我能够从json中获取标记数组并将其显示在地图上&我使用了SetInterval函数从数据库中获取更新的纬度和经度。 问题是由于setInterval函数,标记保持重叠。我从stackoverflow中找到了一个解决方案来删除重复的标记,但现在我的数据库中有两个标记,但这里只显示一个标记。我想更新这两个标记而不重复。 我的代码到现在为止(仅适用于一个标记) setInterval(函数()
setInterval(函数(){
$.ajax({
url:“http://dbmysite.net/getlatlongdriver.php",
类型:“post”,
数据类型:“json”,
成功:功能(数据、状态){
$.mobile.load('hide');
$。每个(数据、功能(i、项){
$。每个(数据、功能(i、项){
/*为响应数据中的每个位置添加一个标记*/
addMarker(item.latitude、item.longitude、item.username);
log(item.username、item.latitude、item.longitude);
});
});
},
错误:函数(){
$.mobile.load('hide');
警报(“意外错误
请稍后重试”);
}
});
}, 1000);
功能添加标记(lat、lng、用户名){
变量标签={
文本:用户名,
颜色:'黑色',
字体大小:“40”
};
变量图标={
url:“../www/img/marker.png”,//url
scaledSize:new google.maps.Size(50,50),//缩放大小
原点:新的google.maps.Point(0,0),//原点
锚点:新的google.maps.Point(0,0)//锚点
};
var latlon={
lat:parseFloat(lat),
液化天然气:液化天然气
}
if(marker&&marker.setMap){
//如果标记已存在,请将其从地图中删除
marker.setMap(空);
}
//创建一个新标记
marker=新的google.maps.marker({
地图:地图,
职位:{
lat:parseFloat(lat),
液化天然气:液化天然气
},
标签:标签,
//图标:图标,
标题:姓名
});
google.maps.event.addListener(标记,'click',函数(事件){
map.panTo(this.getPosition());
map.setZoom(16);
}.绑定(标记);
}
var-map=null;
var gmarkers=[];
var区间数=0;
setInterval(函数(){
$.ajax({
url:“http://quickexample.com/FindMyRide/getlatlongdriver.php",
类型:“post”,
数据类型:“json”,
成功:功能(响应){
$.mobile.load('hide');
$。每个(响应、功能(i、项目){
$。每个(响应、功能(i、项目){
/*为响应数据中的每个位置添加一个标记*/
var lat=项目纬度;
var lng=项目经度;
更新地图(响应、项目.纬度、项目.经度);
});
});
},
错误:函数(){
$.mobile.load('hide');
警报(“意外错误
请稍后重试”);
}
});
}, 3000);
更新地图=功能(数据、纬度、液化天然气){
变量图标={
url:“../www/img/marker.png”,//自定义标记的url
scaledSize:new google.maps.Size(50,50),//缩放大小
原点:新的google.maps.Point(0,0),//原点
锚点:新的google.maps.Point(0,0)//锚点
};
var bounds=new google.maps.LatLngBounds();
//首先删除所有现有标记
对于(变量i=0;i”+marker.getPosition().toUrlValue(6));
信息窗口。打开(地图、标记);
});
(功能(标记、数据){
google.maps.event.addListener(标记“单击”,函数(e){
infoWindow.setContent(data.username+“
”+marker.getPosition().toUrlValue(6));
信息窗口。打开(地图、标记);
});
})(标记,数据[i]);
G标记器。推(标记器);
}
};
函数初始化(){
//在页面加载时初始化映射。