画线

drawPolyline() {
      let colorList = [
        "#c0392b",
        "#e74c3c",
        "#d35400",
        "#e67e22",
        "#f39c12",
        "#f1c40f",
        "#8e44ad",
        "#9b59b6",
        "#2980b9",
        "#3498db",
        "#27ae60",
        "#2ecc71",
        "#16a085",
        "#1abc9c"
      ]
      this.busPolyline = this.busPoint.map((item, index) => {
        let polyLine = new AMap.Polyline({
          map: this.map,
          path: item.path,
          title: item.name,
          strokeColor: colorList[index],
          strokeWeight: 4,
          outlineColor: "#fff",
          extData: {color: colorList[index],
            title: item.name,
            desc: [item.busStation.join("→")],
            img: []}
        })
        return polyLine;
      })
      this.busPolyline.forEach(item => {
        item.on('click', e => {
          this.busPolyline.forEach(subItem => {
            subItem.setOptions({strokeColor: subItem.getExtData().color,
              strokeWeight: 4,
              outlineColor: "#fff",
              isOutline: false
            })
          })
          e.target.setOptions({strokeColor: e.target.getExtData().color,
            strokeWeight: 4,
            outlineColor: "#fff",
            borderWeight: 2,
            isOutline: true
          })
          this.isDialogShow = false;
          if (e.target.getExtData().desc === "") {return}
          setTimeout(() => {this.isDialogShow = true;}, 500);
          console.log(this.msgDetail);

          this.msgDetail = e.target.getExtData();
          this.map.setFitView(e.target)
        })
      })
    },

drawPoint() {
      let shape = type => {return `<div class="svg-icon"><svg class="legend-bg" version="1.1" xmlns="http://www.w3.org/2000/svg" width="36" height="48" ><g><path stroke-width="0" fill="${this.viewList.find(item => item.type == type).color}" d="M13.896,0C6.202,0,0,6.076,0,13.555C0,25.629,13.896,37.392,13.896,37.392s13.896,-11.997,13.896,-23.837C27.792,6.076,21.59,0,13.896,0z" /></g></svg><svg class="icon legend-icon" style="fill:${this.viewList.find(item => item.type == type).color};" aria-hidden="true"><use xlink:href="#${this.viewList.find(item => item.type == type).icon}"></use></svg></div>`}
      this.mapMarkers = this.mapPoint.map((item, index) => new AMap.Marker({content: shape(item.type),
        position: item.coordinate,
        map: this.map,
        title: item.xmmc,
        // offset: new AMap.Pixel(-15, -80),
        extData: {
          desc: item.desc,
          type: item.type,
          img: item.img,
          title: item.xmmc
        },
        topWhenClick: true
      }))
      this.mapMarkers.forEach((item) => {
        item.on('click', e => {
          this.mapMarkers.forEach(item => {item.setAnimation("AMAP_ANIMATION_NONE")
          })
          this.isDialogShow = false;
          item.setAnimation("AMAP_ANIMATION_BOUNCE")
          if (item.getExtData().desc === "") {return}
          setTimeout(() => {this.isDialogShow = true;}, 500);
          this.msgDetail = item.getExtData();
          this.map.setZoomAndCenter(17, [item.C.position.lng, item.C.position.lat])
        })
      })
    },