Baidu Maps shows only one cover when creating multiple road books.

effect
clipboard.png

          _showMap () {
            let map = new BMap.Map("container");  // Map
            let point = new BMap.Point(116.4185,39.9142);  // 
            map.centerAndZoom(point, 19); // 
            map.enableScrollWheelZoom(true);  //

            function makerTeam(teams) {
              for (let i=0,len=teams.length; i<len ; iPP) {
                // 
                let point = new BMap.Point(teams[i].lng, teams[i].lat);
                let team = new BMap.Icon(teams[i].name === "" ? "src/images/fireFightingTeam.png" : "src/images/otherTeam.png", new BMap.Size(17.3*2,14.2*2),{imageSize:new BMap.Size(17.3*2,14.2*2)});
                let marker = new BMap.Marker(point,{icon:team});
                map.addOverlay(marker);
                // 
                let label = new BMap.Label(teams[i].name,{offset:new BMap.Size(-10,30)});
                label.setStyle({
                  color: "-sharpfff",
                  fontSize: "12px",
                  padding: "5px",
                  background: "rgba(0, 0, 0, .5)",
                  border: "2px solid -sharp000",
                  fontFamily:"",
                  borderRadius: "3px"
                });
                marker.setLabel(label);
              }
            }
            makerTeam(this.teams);

            function vehicleRun (vehicles) {
              for (let i=0,len=vehicles.length; i<len; iPP) {
                var lushu;
                let circle;
                // 
                let drv = new BMap.DrivingRoute(vehicles[i].city, {
                  onSearchComplete: function(res) {
                    if (drv.getStatus() == BMAP_STATUS_SUCCESS) {
                      let plan = res.getPlan(0);
                      let arrPois =[];
                      for(let j=0;j<plan.getNumRoutes();jPP){
                        let route = plan.getRoute(j);
                        arrPois= arrPois.concat(route.getPath());
                      }
                      map.addOverlay(new BMap.Polyline(arrPois, {strokeColor: "-sharp111"}));
                      map.setViewport(arrPois);

                      lushu = new BMapLib.LuShu(map,arrPois,{
                        defaultContent: "",//""
                        autoView: true,//
                        icon: new BMap.Icon("src/images/selectedVehicle.png", new BMap.Size(37.58*2,13.6*2),{imageSize:new BMap.Size(37.58*2,13.6*2)}),
                        speed: 100,
                        enableRotation: true,//marker
                        landmarkPois: [
                          {lng:116.314782,lat:39.913508,html:"",pauseTime:2},
                          {lng:116.315391,lat:39.964429,html:"<div><img src="http://map.baidu.com/img/logo-map.gif"/></div>",pauseTime:3},
                          {lng:116.381476,lat:39.974073,html:"<div><img src="http://ishouji.baidu.com/resource/images/map/show_pic04.gif"/></div>",pauseTime:2}
                        ]
                      });
                      circle = new BMapLib.LuShu(map,arrPois,{
                        defaultContent: "",//""
                        autoView: true,//
                        icon: new BMap.Icon("src/images/circle.png", new BMap.Size(56.69*10,31.89*10),{imageSize:new BMap.Size(56.69*10,31.89*10)}),
                        speed: 100,
                        enableRotation: true,//marker
                        landmarkPois: [
                          {lng:116.314782,lat:39.913508,html:"",pauseTime:2},
                          {lng:116.315391,lat:39.964429,html:"<div><img src="http://map.baidu.com/img/logo-map.gif"/></div>",pauseTime:3},
                          {lng:116.381476,lat:39.974073,html:"<div><img src="http://ishouji.baidu.com/resource/images/map/show_pic04.gif"/></div>",pauseTime:2}
                        ]
                      });
                      console.log(lushu)
                    }
                  }
                });
                drv.search(vehicles[i].start, vehicles[i].end);
                setTimeout(function(){
                  lushu.start();
                  circle.start();
                },1000);
              }
            }
            vehicleRun(this.vehicles);
          }

Why is the cover truck on the right not displayed, but the red dotted circle is also shown in the picture?

Mar.04,2021

would like to ask you the question of turning the page, you can add a qq or something

Menu