Browse Source

测量工具

彭宇 2 years ago
parent
commit
54b07f9efb
1 changed files with 128 additions and 0 deletions
  1. 128 0
      src/components/supermap.vue

+ 128 - 0
src/components/supermap.vue

@@ -42,6 +42,109 @@
       isEditableLayers: {
         handler (newValue, oldValue) {
           if (newValue) {
+            //添加画图的提示信息
+            window.L.drawLocal.draw.toolbar = {
+              actions: {
+                title: '取消绘图',
+                text: '取消'
+              },
+              finish: {
+                title: '完成绘图',
+                text: '完成'
+              },
+              undo: {
+                title: '删除最后绘制的点',
+                text: '删除最后一个点'
+              },
+              buttons: {
+                polyline: '绘制折线',
+                polygon: '绘制多边形',
+                rectangle: '绘制矩形',
+                circle: '绘制圆圈',
+                marker: '绘制标记',
+                circlemarker: '绘制圆圈标记'
+              }
+            }
+            window.L.drawLocal.draw.handlers = {
+              circle: {
+                tooltip: {
+                  start: '单击并拖动以绘制圆形'
+                },
+                radius: '半径'
+              },
+              circlemarker: {
+                tooltip: {
+                  start: '点击地图放置圆圈标记'
+                }
+              },
+              marker: {
+                tooltip: {
+                  start: '点击地图放置标记'
+                }
+              },
+              polygon: {
+                tooltip: {
+                  start: '点击开始绘制形状',
+                  cont: '点击继续绘制形状',
+                  end: '单击第一个点以关闭此形状'
+                }
+              },
+              polyline: {
+                error: '<strong>Error:</strong> shape edges cannot cross!',
+                tooltip: {
+                  start: '点击开始画线',
+                  cont: '点击继续画线',
+                  end: '单击最后一点以完成线'
+                }
+              },
+              rectangle: {
+                tooltip: {
+                  start: '单击并拖动以绘制矩形'
+                }
+              },
+              simpleshape: {
+                tooltip: {
+                  end: '释放鼠标完成绘图'
+                }
+              }
+            }
+            window.L.drawLocal.edit = {
+              toolbar: {
+                actions: {
+                  save: {
+                    title: '保存更改',
+                    text: '保存'
+                  },
+                  cancel: {
+                    title: '取消编辑,放弃所有更改',
+                    text: '取消'
+                  },
+                  clearAll: {
+                    title: '清除所有图层',
+                    text: '清除所有'
+                  }
+                },
+                buttons: {
+                  edit: '编辑图层',
+                  editDisabled: '没有可编辑的图层',
+                  remove: '删除图层',
+                  removeDisabled: '没有可删除的图层'
+                }
+              },
+              handlers: {
+                edit: {
+                  tooltip: {
+                    text: '拖动手柄或标记以编辑要素',
+                    subtext: '单击取消以撤消更改'
+                  }
+                },
+                remove: {
+                  tooltip: {
+                    text: '单击要删除的功能'
+                  }
+                }
+              }
+            }
             var editableLayers = new window.L.FeatureGroup();
             this.map.addLayer(editableLayers);
             let options = {
@@ -61,6 +164,21 @@
             };
             this.drawControl = new window.L.Control.Draw(options);
             this.map.addControl(this.drawControl);
+            this.map.on(window.L.Draw.Event.DRAWSTART, function (e) {
+              debugger
+              let sourceTarget = e.sourceTarget;
+              let layerType = e.layerType;
+              if(layerType === "marker"){
+                let icon = new window.L.Icon({
+                  iconUrl: iconList['marker'],
+                  iconSize: [48, 48],
+                  iconAnchor: [24, 40],
+                  popupAnchor: [-3, -40],
+                  shadowSize: [41, 41],
+                })
+                sourceTarget.options.icon=icon;
+              }
+            });
             this.map.on(window.L.Draw.Event.CREATED, function (e) {
               let editableLayer = e.layer;
               let layerType = e.layerType;
@@ -84,6 +202,16 @@
                   modal.msg((dis / 10e2).toFixed(2) + "km");
                 }
               })
+              if(layerType === "marker"){
+                let icon = new window.L.Icon({
+                  iconUrl: iconList['marker'],
+                  iconSize: [48, 48],
+                  iconAnchor: [24, 40],
+                  popupAnchor: [-3, -40],
+                  shadowSize: [41, 41],
+                })
+                editableLayer.options.icon=icon;
+              }
               editableLayers.addLayer(editableLayer);
             });
           }else{