vue vmap 高德地图路线规划

组件

调用组件

"test" :markerData="markerData" :centerPosition="centerPosition">

方法

  _getTechnicians() {
      const _self = this;
      setTimeout(() => {
        let imgDataArr = [require("./images/avatar2.jpg")];
        let imgNoData = "";
        console.log(imgNoData, "imgNoData");
        this.gridPersonnel = [
          {longitude: '113.232072', latitude: '23.409362' },
          {longitude: '113.269342', latitude: '23.40691' },
          {longitude: '113.259342', latitude: '23.418916' },
          {longitude: '113.252342', latitude: '23.410916' },
        ];
        this.markerData = this.gridPersonnel.map((item, index) => {
          imgNoData = parseInt(Math.random() * (imgDataArr.length - 1 + 1));
          let content = `

                        {imgDataArr[imgNoData]} "/>
                      
`;
          if (_self.activeMarker) {
            if (_self.activeMarker.autoId === item.autoId) {
              content = `

                        {imgDataArr[imgNoData]}"/>  
                      
`;
            }
          }

          return {
            position: [parseFloat(item.longitude), parseFloat(item.latitude)],
            avatar: item.image,
            events: {
              click() {
                _self.activeMarker = item;
                let startAndEnd = {
                  Clng: item.longitude,
                  Clat: item.latitude,
                  Flng: item.longitude,
                  Flat: item.latitude,
                  Tlng: "113.282072",
                  Tlat: "23.40691",
                };
                _self.$refs.test.createMap(startAndEnd);
                _self._getStaff(item.staffAccount);

                _self.markerData.forEach((marker, i) => {
                  if (i === index) {
                    marker.content = `

                        {imgDataArr[imgNoData]}"/>
                      
`;
                  } else {
                    marker.content = `

                        {imgDataArr[imgNoData]}"/>
                      
`;
                  }
                });
              }
            },
            content
          };
        });
      }, 2000);
    },