Javascript 延迟以防止地图拖动时的多个ajax调用
每次缩放或拖动地图时,我都会调用ajax,如下所示:Javascript 延迟以防止地图拖动时的多个ajax调用,javascript,jquery,google-maps,google-maps-api-3,Javascript,Jquery,Google Maps,Google Maps Api 3,每次缩放或拖动地图时,我都会调用ajax,如下所示: function initialize(lat, lng) { var myLatlng = new google.maps.LatLng(lat,lng); var mapOptions = { mapTypeControl: false, center: myLatlng, zoom: 15, }; map = new google.maps.Map(document.get
function initialize(lat, lng) {
var myLatlng = new google.maps.LatLng(lat,lng);
var mapOptions = {
mapTypeControl: false,
center: myLatlng,
zoom: 15,
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
google.maps.event.addListener(map, 'zoom_changed', function() {
getResults(map.getBounds());
});
google.maps.event.addListener(map, 'dragend', function() {
getResults(map.getBounds());
});
};
function getListings(bounds){
data = {'South_Lat':bounds.getSouthWest().lat(), 'South_Lng':bounds.getSouthWest().lng(), 'North_Lat':bounds.getNorthEast().lat(), 'North_Lng':bounds.getNorthEast().lng()};
$.ajax({
type: "POST",
dataType: 'json',
url: "<?=$results_url;?>",
data: data,
success: function (json) {
// do something
}
});
}
功能初始化(lat、lng){
var mylatng=new google.maps.LatLng(lat,lng);
变量映射选项={
mapTypeControl:false,
中心:myLatlng,
缩放:15,
};
map=new google.maps.map(document.getElementById('map-canvas'),mapOptions);
google.maps.event.addListener(映射'zoom_changed',函数(){
getResults(map.getBounds());
});
google.maps.event.addListener(映射'dragend',函数(){
getResults(map.getBounds());
});
};
函数getListings(界限){
数据={'South_-Lat':bounds.getSouthWest().Lat(),'South_-Lng':bounds.getSouthWest().Lng(),'North_-Lat':bounds.GetNorthwest().Lat(),'North_-Lng':bounds.GetNorthwestern().Lng();
$.ajax({
类型:“POST”,
数据类型:“json”,
url:“”,
数据:数据,
成功:函数(json){
//做点什么
}
});
}
但是,有时用户可能会在处理一个呼叫时继续拖动或缩放。例如,当用户使用鼠标滚轮时,它会在每个缩放步骤上触发缩放更改
为了防止服务器过载,我想在执行ajax之前增加1到2秒的延迟,以等待进一步的缩放或拖动
我如何在这里实现这一点?这是一个报告的错误
建议使用事件“idle”
使用(或其他库中的等效项)和idle事件
var debouncedLoad = _.debounce(getDataFromServer, 2000/*2 seconds*/);
google.maps.event.addListener(map, 'idle', function() {
debouncedLoad();
});
对于jquery如果使用mapping api制作商业应用程序,请记住谷歌经常更改其许可证,并且目前不允许在不支付每个用户每月高昂费用的情况下发布实时跟踪。我推荐OSM(openstreetmaps)。谢谢。我知道这一点。尝试使用空闲的,但仍然不能解决我的问题。一旦我停止拖动或缩放,它就会执行ajax。有没有办法增加空闲触发时间?在ajax运行时停止拖动,并使用ajax finish解除阻塞,这是在没有空闲事件的情况下实现这一点的唯一安全方法。或者,为ajax调用创建一个hublist,并使用jquery promisse,但这更困难,更多。
var debouncedLoad = _.debounce(getDataFromServer, 2000/*2 seconds*/);
google.maps.event.addListener(map, 'idle', function() {
debouncedLoad();
});