百度地图在jsp页面加载大量轨迹导致地图卡顿

时间:2023-03-08 15:35:01

原画线方式:

//存储大量点轨迹json数组:historyPathList
for(var i=0;i<historyPathList.length-1;i++){
drawColorLine(i,color,4,historyPathList);
}
//显示原始路线
function drawColorLine(i,color,weitht,list){
var polyline = new BMap.Polyline([
new BMap.Point(list[i].Lng,list[i].Lat),//起始点的经纬度
new BMap.Point(list[i+1].Lng,list[i+1].Lat)//终点的经纬度
], {strokeColor:color,//设置颜色
strokeWeight:weitht, //宽度
strokeOpacity:1});//透明度
map.addOverlay(polyline);
}
这样写会多加很多不必要的点,而且对API调用了过多次数,会影响性能。

改进:

 var polylinePointsArray = [];
for(var i=0;i<historyPathList.length;i++){
polylinePointsArray[i] = new BMap.Point(historyPathList[i].Lng,historyPathList[i].Lat);
}
var polyline = new BMap.Polyline(polylinePointsArray, {strokeColor:"green", strokeWeight:4, strokeOpacity:1})
polyline.id = 123456;
map.addOverlay(polyline);
备注:Polyline是个覆盖物对象,可以和其他对象一样自定义属性的,比如在声明以后设置polyline的id属性直接用polyline.id=content就可以了。再例如:polyline.name 
或 polyline.length等。覆盖物对象可以根据自己的需求自定义任何属性,取值的时候只需按这个字段取就可以了。