百度地图只加载视野内的坐标点

功能说明:覆盖物多于300操作不流畅,只加载视野内的坐标点可改善加载速度尽可能多的加载覆盖物、坐标点;
如下是JS 脚本:

var map,info,bssw,bsne,cur_bssw,cur_bsne,lenboo=false;

function displayMap(){
var ids="";
var arrSon = document.getElementsByName("checkbox");
for(i=0;i<arrSon.length;i++) {
if(arrSon[i].checked)ids+=","+arrSon[i].value;
}
if(ids.length<1){
alert("请选择业务员!");
return;
}else if(ids.length<40){
lenboo=true;
}
var url = "<%=basePath %>terminal/gps!loadShopGps.action?ids="+ids.substring(1,ids.length);
asyncRequestCallback(function(data){
loadMaps(data.lineList,data.cur_gps);
},url);
}
function loadMaps(dtoList,cur_gps){
map = new BMap.Map("map_canvas");
info=cur_gps.split(",");
var centerpoint = new BMap.Point(info[1],info[0]);
map.centerAndZoom(centerpoint, 14);
map.enableScrollWheelZoom();
map.addControl(new BMap.NavigationControl());
map.addControl(new BMap.MapTypeControl({mapTypes:[BMAP_NORMAL_MAP,BMAP_HYBRID_MAP]}));
map.addControl(new BMap.ScaleControl());
map.addControl(new BMap.OverviewMapControl());
map.addEventListener("dragend", function(e){
cur_bssw=map.getBounds().getSouthWest();
cur_bsne=map.getBounds().getNorthEast();
if(cur_bssw.lng!=bssw.lng || cur_bssw.lat!=bssw.lat)loopDisplayMap(dtoList);
})
map.addEventListener("zoomend", function(){
cur_bssw=map.getBounds().getSouthWest();
cur_bsne=map.getBounds().getNorthEast();
if(cur_bssw.lng!=bssw.lng || cur_bssw.lat!=bssw.lat)loopDisplayMap(dtoList);
});
loopDisplayMap(dtoList)
}
function loopDisplayMap(dtoList){
map.clearOverlays();
var mk =new BMap.Marker(new BMap.Point(info[1],info[0]));
map.addOverlay(mk);
var opts ={150,height:40,title:"<b>公司名称:<b>"};
var iw = new BMap.InfoWindow("&nbsp;&nbsp;"+info[2],opts);
mk.addEventListener("mouseover",function(){
mk.openInfoWindow(iw,new BMap.Point(info[1],info[0]));
});
mk.addEventListener("mouseout",function(){
mk.closeInfoWindow(iw);
});
var icon1= new BMap.Icon("<%=basePath%>common/images/pin_little.png",new BMap.Size(10,13),{anchor:new BMap.Size(5,13)});
var icon2= new BMap.Icon("<%=basePath%>common/images/pin_red.png",new BMap.Size(18,25),{anchor:new BMap.Size(9,25)});
var icon3= new BMap.Icon("<%=basePath%>common/images/pin_yellow.png",new BMap.Size(18,25),{anchor:new BMap.Size(9,25)});
var icon4= new BMap.Icon("<%=basePath%>common/images/pin_green.png",new BMap.Size(18,25),{anchor:new BMap.Size(9,25)});
var list,arr,shop,polyline;
var bs= map.getBounds();
bssw = bs.getSouthWest();
bsne = bs.getNorthEast();
for(var i = 0; i < dtoList.length; i++){
list=dtoList[i].gpsShopList;
arr=new Array();
for(var j = 0; j < list.length; j++){
shop = list[j];
if(bssw.lng<shop.longitude && bssw.lat<shop.latitude && bsne.lng>shop.longitude && bsne.lat>shop.latitude){
addRedDot(shop,shop.state==-1?icon1:shop.state==0?icon2:shop.state==1?icon3:icon4,dtoList[i].lineName,dtoList[i].realName);
arr.push(new BMap.Point(shop.longitude,shop.latitude));
}
}
polyline = new BMap.Polyline(arr,{strokeColor:"blue", strokeWeight:1, strokeOpacity:1});
if(lenboo)map.addOverlay(polyline);
}
}
function addRedDot(shop,icon,lineName,realName){
var p1 = new BMap.Point(shop.longitude,shop.latitude);
var marker=new BMap.Marker(p1,{icon:icon,raiseOnDrag:true});
marker.addEventListener("click", function(e){
var opts ={250,height:98,title:"<b>"+realName+"</b>"};
    var addr="所属线路:"+lineName+"<br/>门店名称:"+shop.shopName+"<br/>详细地址:"+shop.chinaAddress;  
    var infoWindow = new BMap.InfoWindow(addr, opts);  //创建信息窗口对象  
    marker.openInfoWindow(infoWindow);
});
map.addOverlay(marker);
}
原文地址:https://www.cnblogs.com/hzcya1995/p/13317777.html