Leaflet地图插件Leaflet.pm使用

包括了绘制图形（矩形，多边形，标记，线条），设置图形样式，监听地图中心点缩放比例，监听图形绘制等基本用法

网址：leaflet.pm - npm (npmjs.com)

initMap(){
      this.map.pm.setLang('zh')               //leaflet pm
      this.map.pm.addControls({               //leaflet pm控件（绘制图形）
        position: 'topright',
        drawPolygon: true, // 绘制多边形
        drawMarker: true, //绘制标记点
        drawCircleMarker: false, //绘制圆形标记
        drawPolyline: true, //绘制线条
        drawRectangle: true, //绘制矩形
        drawCircle: false, //绘制圆圈
        editMode: false, //编辑多边形
        dragMode: false, //拖动多边形
        cutPolygon: false, // 添加一个按钮以删除多边形里面的部分内容
        removalMode: true // 清除多边形
      })
 
      this.map.on('zoomend', e => {            //leaflet pm的zoom监听函数
        this.mapCenter = this.map.getCenter()  //获取当前经纬度
        this.mapZoom = e.target._zoom          //获取当前缩放级别
      })
      this.map.on('pm:create', e => {          //leaflet pm绘制图形监听函数
        if (e.shape == 'Marker') {             //返回的e中有其边框经纬度，形状等信息
          this.shape = e.layer._latlng
        } else {
          this.shape = e.layer._latlngs
        }
      })

      this.map.on('pm:remove', e => {            //监听删除

      }) 
},

changeStyle(){                             //设置leaflet pm绘制图形的颜色，粗细等
      var options = {
        templineStyle: {//实线
          color: '#97bdff'
        },
        hintlineStyle: {//虚线
          color: '#97bdff',
          dashArray: [5, 5]
        },
        pathOptions: {//绘制完成后
          color: '#94c6ff', //线
          fillColor: 'blue', //内部
          weight: 0.9
        }
      }
      this.map.pm.enableDraw('Polygon', options)
      this.map.pm.enableDraw('Rectangle', options)
    }