互联网-社管一张图，画矩形：快速双击结束没问题；但是间隔双击有问题，即单击一次，间隔1s再单击一次居然可以结束绘制，且会选中目标；

src/components/easyMap/func/base-draw.ts

@@ -403,6 +403,7 @@ export const drawEdits = (map, obj, emitWkt) => {
                 const addInteraction = () => {
                     const id = 'baseDrawName'
                     const draw = new interaction.Draw({
+                        stopClick: true,
                         source: _source,//测量绘制层数据源
                         type: obj.featureType,  //几何图形类型
                         // geometryFunction: typeSelect === 'rectangle' ? createBox() : null,
@@ -417,7 +418,6 @@ export const drawEdits = (map, obj, emitWkt) => {
                     let listener;
                     //绑定交互绘制工具开始绘制的事件
                     const drawstartHandle = (evt) => {
-                        store.commit('gis/SET_IS_DRAWING', true)
                         sketch = evt.feature; //绘制的要素
                         let tooltipCoord = evt.coordinate;// 绘制的坐标
                         //绑定change事件，根据绘制几何类型得到测量长度值或面积值，并将其设置到测量工具提示框中显示
@@ -449,9 +449,6 @@ export const drawEdits = (map, obj, emitWkt) => {
                         document.body.removeChild(str)
                     }
                     const drawendHandle = (evt) => {
-                        setTimeout(() => {
-                            store.commit('gis/SET_IS_DRAWING', false)
-                        }, 300)
                         map.removeInteraction(map.getInteractions().getArray().filter(v => v.get(id) === id)[0]);
                         // 标绘的时候不需要最终结果dom
                         map.removeOverlay(map.getOverlayById('baseDrawHelpTooltipElementId'))

src/components/easyMap/func/draw.ts

@@ -150,6 +150,7 @@ export default function Draw (map, typeSelect) {
             const addInteraction = () => {
                 const id = 'drawName'
                 const draw = new interaction.Draw({
+                    stopClick: true,
                     source: _source,//测量绘制层数据源
                     // @ts-ignore
                     type: typeMapper.get(typeSelect),  //几何图形类型
@@ -182,7 +183,6 @@ export default function Draw (map, typeSelect) {
                 let listener;
                 //绑定交互绘制工具开始绘制的事件
                 const drawstartHandle = (evt) => {
-                    store.commit('gis/SET_IS_DRAWING', true)
                     sketch = evt.feature; //绘制的要素
                     let tooltipCoord = evt.coordinate;// 绘制的坐标
                     //绑定change事件，根据绘制几何类型得到测量长度值或面积值，并将其设置到测量工具提示框中显示
@@ -214,9 +214,6 @@ export default function Draw (map, typeSelect) {
                     document.body.removeChild(str)
                 }
                 const drawendHandle = (evt) => {
-                    setTimeout(() => {
-                        store.commit('gis/SET_IS_DRAWING', false)
-                    }, 300)
                     map.removeInteraction(map.getInteractions().getArray().filter(v => v.get(id) === id)[0]);
                     // const del = document.createElement("div");
                     // del.className = "lineDel";

src/components/easyMap/func/measure.ts

@@ -154,6 +154,7 @@ export default function Measure (map, typeSelect) {
         const addInteraction = () => {
             const id = 'measureName'
             const draw = new interaction.Draw({
+                stopClick: true,
                 source: _source,//测量绘制层数据源
                 // @ts-ignore
                 type: typeMapper.get(typeSelect),  //几何图形类型
@@ -185,7 +186,6 @@ export default function Measure (map, typeSelect) {
             let listener;
             //绑定交互绘制工具开始绘制的事件
             const drawstartHandle = (evt) => {
-                store.commit('gis/SET_IS_DRAWING', true)
                 sketch = evt.feature; //绘制的要素
                 let tooltipCoord = evt.coordinate;// 绘制的坐标
                 //绑定change事件，根据绘制几何类型得到测量长度值或面积值，并将其设置到测量工具提示框中显示
@@ -217,9 +217,6 @@ export default function Measure (map, typeSelect) {
                 document.body.removeChild(str)
             }
             const drawendHandle = (evt) => {
-                setTimeout(() => {
-                    store.commit('gis/SET_IS_DRAWING', false)
-                }, 300)
                 map.removeInteraction(map.getInteractions().getArray().filter(v => v.get(id) === id)[0]);
                 const del: any = document.createElement("div");
                 del.className = "lineDel";

src/store/modules/gis.ts

@@ -22,7 +22,6 @@ const formatWkt = (wkt) => {
 const featureTypeKey = 'featureType'
 
 const state = {
-  isDrawing: false,
   menuRootName: '9cd5fbf9-35fd-4fb2-8c24-1f871afd67be',
   isTooling: false,
   videoParams: {
@@ -138,9 +137,6 @@ const getters = {
 }
 
 const mutations = {
-  SET_IS_DRAWING(state, flag) {
-    state.isDrawing = flag
-  }
 }
 
 const actions = {
@@ -403,31 +399,28 @@ const actions = {
         }
       }
       state.map.on('singleclick', e => {
-        if (!state.isDrawing) {
-
-          let isFeature = false
-          e.map.forEachFeatureAtPixel(e.pixel, (feature) => {
-            if (!isFeature) {
-              isFeature = true
-              switch (feature.get(featureTypeKey)) {
-                case 'qy': clickQy(e, feature)
-                  break
-                case 'sb': clickDefault(e, feature)
-                  break
-                case 'qyAnalysisCircle': isFeature = false
-                  break
-                case 'analysisCircle': isFeature = false
-                  break
-                case 'statisticFeature': isFeature = false
-                  break
-              }
-            }
-          }, {
-            hitTolerance: 0,
-          });
+        let isFeature = false
+        e.map.forEachFeatureAtPixel(e.pixel, (feature) => {
           if (!isFeature) {
-            handleTileClick(e)
+            isFeature = true
+            switch (feature.get(featureTypeKey)) {
+              case 'qy': clickQy(e, feature)
+                break
+              case 'sb': clickDefault(e, feature)
+                break
+              case 'qyAnalysisCircle': isFeature = false
+                break
+              case 'analysisCircle': isFeature = false
+                break
+              case 'statisticFeature': isFeature = false
+                break
+            }
           }
+        }, {
+          hitTolerance: 0,
+        });
+        if (!isFeature) {
+          handleTileClick(e)
         }
       })
     }

src/views/gis/layout/tools/analysis.vue

@@ -221,6 +221,7 @@ export default defineComponent({
         createHelpTooltip(); //创建帮助提示框
         //  标绘
         state.cusTransfer.analysisDraw = new interaction.Draw({
+          stopClick: true,
           source: store.state.gis.analysis.source,//测量绘制层数据源
           type: 'Circle',  //几何图形类型
           style: new style.Style({
@@ -237,14 +238,10 @@ export default defineComponent({
         // @ts-ignore
         props.map.addInteraction(state.cusTransfer.analysisDraw);
         const drawstartHandle = (evt) => {
-          store.commit('gis/SET_IS_DRAWING', true)
           sketch = evt.feature; //绘制的要素
         }
         state.cusTransfer.analysisDraw.on('drawstart', drawstartHandle);
         const drawendHandle = (evt) => {
-          setTimeout(() => {
-            store.commit('gis/SET_IS_DRAWING', false)
-          }, 300)
           // 标绘的时候不需要最终结果dom
           props.map.removeOverlay(helpTooltip)
           sketch = null; //置空当前绘制的要素对象

src/views/gis/layout/tools/select-draw.ts

@@ -150,6 +150,7 @@ export default function SelectDraw (map, typeSelect) {
             };
             const addInteraction = () => {
                 selectDraw = new interaction.Draw({
+                    stopClick: true,
                     source: _source,//测量绘制层数据源
                     // @ts-ignore
                     type: typeMapper.get(typeSelect),  //几何图形类型
@@ -182,7 +183,6 @@ export default function SelectDraw (map, typeSelect) {
                 let listener;
                 //绑定交互绘制工具开始绘制的事件
                 const drawstartHandle = (evt) => {
-                    store.commit('gis/SET_IS_DRAWING', true)
                     sketch = evt.feature; //绘制的要素
                     let tooltipCoord = evt.coordinate;// 绘制的坐标
                     //绑定change事件，根据绘制几何类型得到测量长度值或面积值，并将其设置到测量工具提示框中显示
@@ -214,9 +214,6 @@ export default function SelectDraw (map, typeSelect) {
                     document.body.removeChild(str)
                 }
                 const drawendHandle = (evt) => {
-                    setTimeout(() => {
-                        store.commit('gis/SET_IS_DRAWING', false)
-                    }, 300)
                     map.removeInteraction(map.getInteractions().getArray().filter(v => v.get(drawId) === drawId)[0]);
                     // const del = document.createElement("div");
                     // del.className = "lineDel";

src/views/gis/layout/tools/tool-draw.ts

@@ -284,6 +284,7 @@ export const draw = (map, obj) => {
                 const addInteraction = () => {
                     const id = 'baseDrawName'
                     const draw = new interaction.Draw({
+                        stopClick: true,
                         source: _source,//测量绘制层数据源
                         type: obj.rectangle ? 'LineString' : obj.featureType,  //几何图形类型
                         // @ts-ignore
@@ -302,7 +303,6 @@ export const draw = (map, obj) => {
                     let listener;
                     //绑定交互绘制工具开始绘制的事件
                     const drawstartHandle = (evt) => {
-                        store.commit('gis/SET_IS_DRAWING', true)
                         sketch = evt.feature; //绘制的要素
                         let tooltipCoord = evt.coordinate;// 绘制的坐标
                         //绑定change事件，根据绘制几何类型得到测量长度值或面积值，并将其设置到测量工具提示框中显示
@@ -334,9 +334,6 @@ export const draw = (map, obj) => {
                         document.body.removeChild(str)
                     }
                     const drawendHandle = (evt) => {
-                        setTimeout(() => {
-                            store.commit('gis/SET_IS_DRAWING', false)
-                        }, 300)
                         map.removeInteraction(map.getInteractions().getArray().filter(v => v.get(id) === id)[0]);
                         // 标绘的时候不需要最终结果dom
                         map.removeOverlay(map.getOverlayById('baseDrawHelpTooltipElementId'))