百度地图海量点清除（始终保留最新的点）

来源：互联网发布：淘宝刷佣金单有风险吗编辑：程序博客网时间：2024/06/08 15:42

将海量点添加到地图上

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="确定" onclick="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[] 对应位置赋值来清楚以前的点并且保证留下最新的海量点。

阅读全文

0 0