高德地图绘制折线条

初始化地图:

    initMap() {
      let $AMap = window.AMap
      if($AMap) {
        this.map = new $AMap.Map("map", {
          zoom: mapConfig.defaultZoom,
          expandZoomRange: true,
          zooms: [8, 20],
          center: mapConfig.defaultCenter,
          pitch: 0,
          viewMode: "2D",
          mapStyle: "amap://styles/e3408e73e03eeaba546fb05d0b7ea46a"
        });
      }
    },

绘制折线:

    addPolyline() {
      let $AMap = window.AMap
      let path = [
        [84.713736, 44.418887],
        [84.773736, 44.415887],
      ]
      // 将折线添加至地图实例 当有两个点以上才开始生成折线
      this.polyline = new $AMap.Polyline({
        path: path.map(a => new $AMap.LngLat(a[0], a[1])), // 设置线覆盖物路径
        strokeColor: '#0066FF', // 线颜色
        strokeWeight: 3, // 线宽
        strokeStyle: "solid",   // 线样式
        strokeDasharray: [10, 5], // 补充线样式
        lineJoin: 'round',
        lineCap: 'round',
      });
      this.polylines.push(this.polyline); // 保存每一个生成的折线
      if(this.isDrawLine) {
        this.polyline.setMap(this.map); // 添加折线
      } else {
        this.map.remove(this.polylines); // 清除全部折线
      }
    },

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值