百度地圖路書添加回調功能

百度路書API

需求分析

在路書跑完後,隱藏小車圖標

頁面效果在這裏插入圖片描述

html

        //路書--start--
_this.drivingCar = new BMap.DrivingRoute('北京', {
      onSearchComplete: function(res) {
          if (_this.drivingCar.getStatus() == BMAP_STATUS_SUCCESS) {
               var points = [];
              for (let o = 0; o < Oelement.trajectorylist.length; o++) {
                points.push(new BMap.Point(Oelement.trajectorylist[o].lon,Oelement.trajectorylist[o].lat))
              }
              console.log('points',points);
              _this.myBmp.addOverlay(new BMap.Polyline(points, {strokeColor: '#fff'}));
              let icon = new BMap.Icon(require('../../../assets/moveCar2.png'), new window.BMap.Size(88,52),{});
              icon.setImageSize(new BMap.Size(88,52));
              _this.myBmp.setViewport(points);
              _this.lushudata = new BMapLib.LuShu(_this.myBmp,points,{
                defaultContent:"",
                autoView:true,
                icon  : icon,
                speed: 9000,   //實時小車
                enableRotation:true,//是否設置marker隨着道路的走向進行旋轉
                landmarkPois: []
              });
          }
      }
  });
  _this.drivingCar.search(startPoint, endPoint);
點擊開始按鈕的事件 method
    startLushu(){
      this.lushudata.start(()=> {  
        console.log("路書結束的回調開始調用了"); 
        // this.lushudata = null; //當前路書置空   
        this.myBmp.removeOverlay(this.publicpoliline); 
      });  
    },

數據格式

在這裏插入圖片描述
說明:由於百度路書js沒有提供回調方法,以上代碼基於百度路書稍作改動,改動後js可去csdn搜索“百度路書添加回調後js”進行下載或聯繫本人發送

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章