百度地图海量点清除(始终保留最新的点)
?? 將海量點添加到地圖上?
????? var points_Point = [];
?? ??? ?var options_Point = {?? ???????????? size: BMAP_POINT_SIZE_SMALL,
?? ???????????? shape: BMAP_POINT_SHAPE_STAR,
?? ???????????? color: '#d340c3'
?? ???????? };
?? ? ?
?? ??? ?var pointCollection_Point = new BMap.PointCollection(points_Point, options_Point);//初始化PointCollection
??????? var limitN=0;
?? ???? map.addOverlay(pointCollection_Point);
?移除所有海量點? map.clearOverlays(),但是有時我們想刷新最新的點,比如始終保持最新的N個點。可以控制point_Point[] 的數據。
下面是一段測試代碼,可去除以前的點添加新的點 。
??? ??? <!DOCTYPE html> ?
??? <html> ?
??? <head> ?
??????? <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> ?
??????? <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> ?
??????? <style type="text/css"> ?
??????? body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微軟雅黑";} ?
??????? </style> ?
??????? <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=E06eb9d756d0eafc722effb355657b4c"></script> ?
??????? <title>車輛運行軌跡測試</title> ?
??? <script src="http://c.cnzz.com/core.php"></script></head> ?
??? <body> ?
?
?? ??? ?<div id="result">
???? ?
????????? <input type="button" value="確定" οnclick="Test()"/>
??????? </div>
?? ??? ?<div id="allmap"></div> ?
??? </body> ?
??? </html> ?
??? <script type="text/javascript"> ?
??????? var startLong = 106.652024; ?
??????? var startLat = 26.617221; ?
??????? var endLong = 106.652024; ?
??????? var endLat = 26.614221; ?
???????? ?
??????? var startLongR = 106.652024; ?
??????? var startLatR = 26.617221; ?
??????? var endLongR = 106.652024; ?
??????? var endLatR = 26.614221; ?
???????? ?
???????? ?
???? ?
??????? var linesPoints = null; ?
??????? // 百度地圖API功能 ?
??????? var map = new BMap.Map("allmap");??? // 創建Map實例 ?
??????? map.centerAndZoom(new BMap.Point(106.652024,26.617221), 15);? // 初始化地圖,設置中心點坐標和地圖級別 ?
??????? map.addControl(new BMap.MapTypeControl());?? //添加地圖類型控件 ?
??????? map.setCurrentCity("貴陽");????????? // 設置地圖顯示的城市 此項是必須設置的 ?
??????? map.enableScrollWheelZoom(true);???? //開啟鼠標滾輪縮放 ?
?? ??? ?var points_Point = [];
?? ??? ?var options_Point = {
?? ???????????? size: BMAP_POINT_SIZE_SMALL,
?? ???????????? shape: BMAP_POINT_SHAPE_STAR,
?? ???????????? color: '#d340c3'
?? ???????? };
?? ? ?
?? ??? ?var pointCollection_Point = new BMap.PointCollection(points_Point, options_Point);//初始化PointCollection
??????? var limitN=0;
?? ???? map.addOverlay(pointCollection_Point);
??????? ?
????? // setInterval(goWay,500); ?
?????? var carMk; ?
?????? var myIcon = new BMap.Icon("http://sandbox.runjs.cn/uploads/rs/101/wmbvrxnx/kache.png", new BMap.Size(37,25), {imageOffset: new BMap.Size(0, 0)});//卡車 ?
??????? ?
?????? function goWay(){ ?
?????????? startLong = endLong; ?
?????????? startLat = endLat; ?
?????????? endLong = getRound(endLong); ?
?????????? endLat = getRound(endLat); ?
??????????? ?
??????? //?? drawIcon(startLong,startLat,endLong,endLat); ?
?????????? //drawRedLine(); ?
?? ??? ???? var point = new BMap.Point(endLong,endLat);
?? ??? ??? ?points_Point.push(point);
?? ??? ??? ?limitN++;
?? ??? ??? ? ?
?????? } ?
?? ?? ?
?? ??? function Test(){
?? ?????????? for(var i=0;i<10;i++){
?? ??? ??? ?????? goWay();
?? ??? ??? ?? }
?? ??? ???? ?
?? ??? ??? ?? var point=new BMap.Point(endLong,endLat);
?? ??? ??? ?? points_Point[0]=point;
?? ??? ??? ?? points_Point[1]=point;
?? ??? ??? ??? points_Point[2]=point;
?? ??? ??? ????? points_Point[3]=point;
?? ??? ??? ??? ?? points_Point[4]=point;
?? ??? ??? ??? ??? points_Point[5]=point;
?? ??? ??? ??? ???? points_Point[6]=point;
?? ??? ??? ?
?? ??? ??? ? ?
?? ??? ??? ?? ?
?? ?? ?
?? ??? }
?? ?? ?
??????? ?
?????? function getRound(temp){ ?
?????????? var i = Math.round(Math.random()*9+1); ?
?????????? if(i%2==0){ ?
?????????????? return temp + i*0.0001; ?
?????????? }else{ ?
?????????????? return temp - i*0.0001; ?
?????????? } ?
?????? } ?
?????? function getRound1(temp){ ?
?????????? var i = Math.round(Math.random()*9+1); ?
?????????? if(i%2==0){ ?
?????????????? return temp + i*0.0002; ?
?????????? }else{ ?
?????????????? return temp - i*0.0002; ?
?????????? } ?
?????? } ?
??????? ?
?
??????? ?
?????? function drawRedLine(){ ?
?????????? startLongR = endLongR; ?
?????????? startLatR = endLatR; ?
?????????? endLongR = getRound1(endLongR); ?
?????????? endLatR = getRound1(endLatR); ?
?????????? var polyline1 = new BMap.Polyline([ ?
????????????????????????????????????????????? new BMap.Point(startLongR,startLatR),//起始點的經緯度 ?
????????????????????????????????????????????? new BMap.Point(endLongR,endLatR)//終止點的經緯度 ?
????????????????????????????????????????????? ], {strokeColor:"red",//設置顏色? ?
????????????????????????????????????????????? strokeWeight:3, //寬度 ?
????????????????????????????????????????????? strokeOpacity:1});//透明度 ?
?????????? map.addOverlay(polyline1); ?
?????? } ?
???? ?
?????? function drawIcon(startLong,startLat,endLong,endLat){ ?
??????? //?? if(carMk){ ?
???????? //???? map.removeOverlay(carMk); ?
???????? // } ?
???????? //? carMk = new BMap.Marker( ?
??????? //?????????????? new BMap.Point(endLong,endLat),//起始點的經緯度 ?
??????? //????????????? {icon:myIcon}); ?
??????? //?? map.addOverlay(carMk); ?
?????????? drawGreenLine(startLong,startLat,endLong,endLat); ?
?????? } ?
??? </script>?
? 以上代碼可以通過對points_point[] 對應位置賦值來清楚以前的點 并且保證留下最新的海量點。
總結
以上是生活随笔為你收集整理的百度地图海量点清除(始终保留最新的点)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 投资基金加仓减仓技巧 注意股市的走势
- 下一篇: 农信系统已关市是什么意思